/* =========================================================
   COMMUNITY HUB MOBILE
   Touch-first cleanup for feed, comments, reactions, modals
   ========================================================= */

@media (max-width: 768px) {
  .ch-feed {
    max-width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .ch-feed .ch-activity-card {
    border-radius: 14px !important;
    padding: 12px !important;
    margin-bottom: 14px !important;
    overflow: visible !important;
  }

  .ch-feed .ch-activity-header {
    gap: 8px;
  }

  .ch-feed .ch-activity-content {
    font-size: 15px !important;
    line-height: 1.5 !important;
  }

  .ch-action-row {
    gap: 4px !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .ch-action-row::-webkit-scrollbar {
    display: none;
  }

  .ch-action-button {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 8px 9px !important;
    font-size: 12px !important;
  }

  .ch-comment {
    gap: 7px;
  }

  .ch-comment-avatar {
    flex: 0 0 30px !important;
  }

  .ch-comment-avatar img {
    width: 30px !important;
    height: 30px !important;
  }

  .ch-comment-main {
    min-width: 0;
    max-width: calc(100% - 37px);
  }

  .ch-comment-bubble {
    max-width: 100% !important;
    width: auto !important;
    padding: 10px 12px !important;
    border-radius: 15px !important;
  }

  .ch-comment-actions {
    flex-wrap: wrap;
    gap: 10px !important;
  }

  .ch-comment-menu {
    opacity: 1 !important;
  }

  .ch-comment-menu-toggle {
    width: 28px !important;
    height: 28px !important;
  }

  .ch-comment-children {
    padding-left: 10px !important;
  }

  .ch-comment-depth-1,
  .ch-comment-depth-2,
  .ch-comment-depth-3 {
    margin-left: 0 !important;
  }

  .ch-comment-depth-1 .ch-comment-avatar,
  .ch-comment-depth-2 .ch-comment-avatar,
  .ch-comment-depth-3 .ch-comment-avatar {
    flex: 0 0 28px !important;
  }

  .ch-comment-depth-1 .ch-comment-avatar img,
  .ch-comment-depth-2 .ch-comment-avatar img,
  .ch-comment-depth-3 .ch-comment-avatar img {
    width: 28px !important;
    height: 28px !important;
  }

  .ch-feed .ch-comment-children > .ch-toggle-replies {
    margin-left: 54px !important;
  }

  .ch-repost-embed {
    border-radius: 14px !important;
  }

  .ch-repost-embed-header {
    padding: 12px 12px 0 !important;
  }

  .ch-repost-embed-text {
    padding: 9px 12px 12px !important;
  }

  .ch-repost-embed-media img,
  .ch-link-preview-image img {
    max-height: 280px !important;
  }

  .ch-link-preview-card {
    border-radius: 14px !important;
  }

  .ch-mention-dropdown {
    max-width: calc(100vw - 20px) !important;
  }
}

/* =========================================================
   MOBILE REACTION PICKER
   ========================================================= */

@media (max-width: 768px) {
  /* Stop desktop hover picker from appearing inline on mobile */
  .ch-comment-reaction-wrap:hover .ch-reaction-picker,
  .ch-comment-reaction-wrap .ch-reaction-picker {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Body-mounted mobile picker */
  body > .ch-mobile-reaction-picker {
    position: fixed !important;
    z-index: 2147483647 !important;
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 9px 11px !important;
    background: #ffffff !important;
    border: 1px solid #dbe3ec !important;
    border-radius: 999px !important;
    box-shadow: 0 14px 38px rgba(15, 23, 42, 0.28) !important;
    max-width: calc(100vw - 20px) !important;
    overflow-x: auto !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }

  body > .ch-mobile-reaction-picker[hidden] {
    display: none !important;
  }

  body > .ch-mobile-reaction-picker .ch-reaction-option {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body > .ch-mobile-reaction-picker .ch-reaction-option-img {
    width: 31px !important;
    height: 31px !important;
    object-fit: contain !important;
  }

  body > .ch-mobile-reaction-picker .ch-reaction-option-emoji {
    font-size: 29px !important;
    line-height: 1 !important;
  }

  body.ch-mobile-reaction-open {
    touch-action: manipulation;
  }
}



/* =========================================================
   MOBILE REACTION PICKER — LONG PRESS + ROWS OF 5
   ========================================================= */

@media (max-width: 768px) {
  /* Disable desktop inline picker on mobile */
  .ch-comment-reaction-wrap .ch-reaction-picker,
  .ch-comment-reaction-wrap:hover .ch-reaction-picker,
  .ch-comment-reaction-wrap.is-picker-open .ch-reaction-picker {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  /* Hide older body-mounted picker versions if another script made one */
  body > .ch-reaction-picker.ch-mobile-reaction-picker {
    display: none !important;
  }

  body > .ch-mobile-reaction-picker {
    position: fixed !important;
    z-index: 2147483647 !important;

    display: grid !important;
    grid-template-columns: repeat(5, 44px) !important;
    grid-auto-rows: 44px !important;
    gap: 8px !important;

    width: max-content !important;
    max-width: calc((44px * 5) + (8px * 4) + 22px) !important;

    padding: 10px 11px !important;
    background: #ffffff !important;
    border: 1px solid #dbe3ec !important;
    border-radius: 24px !important;
    box-shadow: 0 14px 38px rgba(15, 23, 42, 0.28) !important;

    overflow: visible !important;
    white-space: normal !important;
  }

  body > .ch-mobile-reaction-picker[hidden] {
    display: none !important;
  }

  body > .ch-mobile-reaction-picker .ch-reaction-option {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body > .ch-mobile-reaction-picker .ch-reaction-option:active {
    transform: scale(0.94);
  }

  body > .ch-mobile-reaction-picker .ch-reaction-option-img {
    width: 31px !important;
    height: 31px !important;
    max-width: 31px !important;
    max-height: 31px !important;
    object-fit: contain !important;
  }

  body > .ch-mobile-reaction-picker .ch-reaction-option-emoji {
    font-size: 29px !important;
    line-height: 1 !important;
  }

  body.ch-mobile-reaction-open {
    touch-action: manipulation;
  }
}



@media (max-width: 768px) {
  .ch-reaction-trigger,
  .ch-reaction-option,
  .ch-mobile-reaction-picker {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
    touch-action: manipulation !important;
  }
}



/* =========================================================
   MOBILE REACTION TOUCH CLEANUP
   ========================================================= */

@media (max-width: 768px) {
  .ch-reaction-trigger,
  .ch-reaction-option,
  .ch-mobile-reaction-picker {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
    touch-action: manipulation !important;
  }

  .ch-reaction-trigger.is-busy {
    opacity: 0.65;
    pointer-events: none;
  }
}



/* =========================================================
   MOBILE REACTION POINTER FIX
   ========================================================= */

@media (max-width: 768px) {
  .ch-reaction-trigger,
  .ch-reaction-option,
  .ch-mobile-reaction-picker,
  .ch-mobile-reaction-picker * {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
    touch-action: none !important;
  }

  .ch-reaction-trigger.is-busy {
    opacity: 0.65;
  }
}



/* =========================================================
   MOBILE ACTION BUTTON POLISH
   ========================================================= */

@media (max-width: 768px) {
  .ch-action-row {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
    overflow: visible !important;
  }

  .ch-action-row .ch-action-button,
  .ch-action-row .ch-reaction-trigger {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    justify-content: center !important;
    padding: 8px 6px !important;
    font-size: 12px !important;
    overflow: hidden !important;
  }

  .ch-action-row .ch-reaction-trigger .ch-reaction-label {
    max-width: 58px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .ch-action-row .ch-reaction-trigger .ch-reaction-count {
    display: none !important;
  }

  .ch-action-row .ch-reaction-trigger .ch-reaction-emoji,
  .ch-action-row .ch-reaction-trigger .ch-reaction-icon-img {
    margin-right: 3px !important;
  }
}



/* =========================================================
   MOBILE ACTION ROW + REPOST COMBO
   ========================================================= */

@media (max-width: 768px) {
  .ch-action-row {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
    overflow: visible !important;
  }

  .ch-action-row .ch-action-button,
  .ch-action-row .ch-reaction-trigger {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    justify-content: center !important;
    padding: 8px 6px !important;
    font-size: 12px !important;
    overflow: hidden !important;
  }

  .ch-action-row .ch-reaction-trigger .ch-reaction-label,
  .ch-repost-button-label {
    max-width: 58px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .ch-action-row .ch-reaction-trigger .ch-reaction-count {
    display: none !important;
  }

  .ch-action-row .ch-reaction-trigger .ch-reaction-emoji,
  .ch-action-row .ch-reaction-trigger .ch-reaction-icon-img,
  .ch-repost-button-icon {
    margin-right: 3px !important;
  }

  .ch-repost-combo-menu {
    width: 180px !important;
    max-width: calc(100vw - 20px) !important;
  }

  .ch-repost-combo-button,
  .ch-repost-combo-menu,
  .ch-repost-combo-menu * {
    -webkit-user-select: none !important;
    user-select: none !important;
    -webkit-touch-callout: none !important;
    touch-action: manipulation !important;
  }
}



/* =========================================================
   MOBILE REACTION BUTTON: EMOJI ONLY AFTER REACTION
   ========================================================= */

@media (max-width: 768px) {
  /* When a reaction is selected, hide the label and show only the emoji/icon */
  .ch-action-row .ch-reaction-trigger.is-liked .ch-reaction-label {
    display: none !important;
  }

  .ch-action-row .ch-reaction-trigger.is-liked .ch-reaction-emoji,
  .ch-action-row .ch-reaction-trigger.is-liked .ch-reaction-icon-img {
    margin-right: 0 !important;
  }

  /* Keep normal unreacted Like readable */
  .ch-action-row .ch-reaction-trigger:not(.is-liked) .ch-reaction-label {
    display: inline !important;
  }
}




/* =========================================================
   COMMUNITY HUB PROFILE PAGE MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-page {
    max-width: 100%;
    padding-left: 10px;
    padding-right: 10px;
  }

  .ch-profile-card {
    border-radius: 18px;
  }

  .ch-profile-cover {
    height: 150px;
  }

  .ch-profile-main {
    display: block;
    padding: 0 14px 16px;
  }

  .ch-profile-avatar-wrap {
    margin-top: -48px;
  }

  .ch-profile-avatar {
    width: 104px;
    height: 104px;
    border-width: 4px;
  }

  .ch-profile-info {
    padding-top: 10px;
  }

  .ch-profile-name {
    font-size: 24px;
  }

  .ch-profile-handle {
    font-size: 13px;
  }

  .ch-profile-bio {
    font-size: 14px;
  }

  .ch-profile-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
  }

  .ch-profile-stat {
    min-width: 0;
    padding: 9px 8px;
  }

  .ch-profile-stat strong {
    font-size: 15px;
  }

  .ch-profile-stat span {
    font-size: 11px;
  }

  .ch-profile-actions {
    padding-top: 14px;
  }

  .ch-profile-action-button {
    width: 100%;
  }

  .ch-profile-tabs {
    overflow-x: auto;
    scrollbar-width: none;
  }

  .ch-profile-tabs::-webkit-scrollbar {
    display: none;
  }

  .ch-profile-tab {
    flex: 0 0 auto;
    padding: 9px 13px;
    font-size: 12px;
  }

  .ch-profile-section-header {
    padding: 13px 14px;
  }

  .ch-profile-section-header h2 {
    font-size: 16px;
  }

  .ch-profile-posts.ch-feed {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}




/* =========================================================
   PROFILE ROUTE TAB CONTENT MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-route-wrap {
    margin: 18px auto;
  }

  .ch-profile-about-card,
  .ch-profile-comments-list,
  .ch-profile-media-grid {
    max-width: 100%;
  }

  .ch-profile-about-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

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

  .ch-profile-media-tile {
    border-radius: 14px;
  }

  .ch-profile-comment-preview {
    border-radius: 14px;
    padding: 13px;
  }
}

/* =========================================================
   COMMUNITY HUB PROFILE EDITOR MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-notice {
    max-width: 100%;
    margin-left: 10px;
    margin-right: 10px;
    border-radius: 14px;
  }

  .ch-profile-edit-form {
    max-width: 100%;
    border-radius: 16px;
    padding: 14px;
  }

  .ch-profile-edit-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ch-profile-edit-preview-row {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .ch-profile-edit-avatar-preview {
    width: 104px;
    height: 104px;
  }

  .ch-profile-edit-cover-preview img,
  .ch-profile-edit-cover-empty {
    height: 120px;
    border-radius: 14px;
  }

  .ch-profile-edit-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .ch-profile-edit-save,
  .ch-profile-edit-cancel {
    width: 100%;
    justify-content: center;
  }
}

/* =========================================================
   PROFILE EDITOR POLISH MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-edit-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .ch-profile-edit-preview-row-top {
    grid-template-columns: 1fr !important;
  }

  .ch-profile-edit-avatar-card,
  .ch-profile-edit-cover-card {
    padding: 12px;
    border-radius: 16px;
  }

  .ch-profile-edit-media-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .ch-profile-file-button,
  .ch-profile-remove-check {
    width: 100%;
    justify-content: center;
  }
}


/* =========================================================
   PROFILE EDITOR WIDTH + REMOVE BUTTON MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-section-header,
  .ch-profile-about-card,
  .ch-profile-edit-form,
  .ch-profile-notice,
  .ch-profile-comments-list,
  .ch-profile-media-grid,
  .ch-profile-posts.ch-feed {
    width: 100% !important;
    max-width: 100% !important;
  }

  .ch-profile-edit-form {
    padding: 14px !important;
  }

  .ch-profile-edit-preview-row,
  .ch-profile-edit-preview-row-top {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .ch-profile-edit-cover-preview img,
  .ch-profile-edit-cover-empty {
    height: 150px !important;
  }

  .ch-profile-edit-media-actions {
    gap: 8px !important;
  }

  .ch-profile-file-button,
  .ch-profile-remove-button {
    min-height: 36px !important;
    font-size: 12px !important;
    padding: 9px 12px !important;
  }
}

/* =========================================================
   ACCOUNT SETTINGS SHELL MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-actions {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 8px !important;
  }

  .ch-profile-settings-shell {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .ch-profile-settings-nav {
    position: static !important;
    display: flex !important;
    gap: 7px !important;
    overflow-x: auto !important;
    padding: 8px !important;
    border-radius: 16px !important;
    scrollbar-width: none;
  }

  .ch-profile-settings-nav::-webkit-scrollbar {
    display: none;
  }

  .ch-profile-settings-nav-item {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 8px 11px;
    font-size: 12px;
  }

  .ch-profile-settings-card {
    border-radius: 16px !important;
    padding: 14px !important;
  }

  .ch-profile-settings-card-head {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 10px !important;
  }

  .ch-profile-settings-button,
  .ch-profile-settings-status {
    width: fit-content;
  }

  .ch-profile-settings-row,
  .ch-profile-settings-option {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 4px !important;
  }

  .ch-profile-settings-row strong,
  .ch-profile-settings-option strong {
    text-align: left !important;
  }
}


/* =========================================================
   COMMUNITY HUB PRIVACY SETTINGS MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-privacy-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .ch-profile-privacy-field,
  .ch-profile-toggle-row {
    border-radius: 14px !important;
    padding: 11px !important;
  }

  .ch-profile-privacy-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
  }

  .ch-profile-settings-actions {
    justify-content: stretch !important;
  }

  .ch-profile-settings-save {
    width: 100% !important;
    min-height: 42px !important;
  }
}


/* =========================================================
   COMMUNITY HUB NOTIFICATION SETTINGS MOBILE
   ========================================================= */

@media (max-width: 768px) {
  .ch-profile-notifications-master,
  .ch-profile-notifications-grid,
  .ch-profile-notifications-summary {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .ch-profile-notification-toggle {
    min-height: 0 !important;
  }

  .ch-profile-notifications-form {
    gap: 14px !important;
  }
}

/* Community Hub Profile Settings - Blocked Users Mobile */
@media (max-width: 720px) {
	.ch-profile-blocked-add {
		grid-template-columns: 1fr;
		align-items: stretch;
	}

	.ch-profile-blocked-add .ch-profile-settings-save {
		width: 100%;
	}

	.ch-profile-blocked-user {
		align-items: flex-start;
	}

	.ch-profile-blocked-user-main {
		min-width: 0;
		flex: 1 1 auto;
	}

	.ch-profile-unblock-check {
		flex: 0 0 auto;
	}
}

@media (max-width: 480px) {
	.ch-profile-blocked-user {
		flex-direction: column;
		align-items: stretch;
	}

	.ch-profile-unblock-check {
		justify-content: center;
		width: 100%;
	}
}


@media (max-width: 640px) {
	.ch-block-member-results {
		position: relative;
		top: auto;
		margin-top: 8px;
		max-height: 240px;
	}

	.ch-profile-blocked-add {
		grid-template-columns: 1fr;
	}
}

/* Account Settings + Badge Shell Mobile */
@media (max-width: 720px) {
	.ch-profile-account-grid,
	.ch-profile-badges-shell-grid,
	.ch-profile-account-status-grid {
		grid-template-columns: 1fr !important;
	}

	.ch-profile-account-actions-row {
		flex-direction: column;
	}

	.ch-profile-account-actions-row .ch-profile-settings-button,
	.ch-profile-account-actions-row .ch-profile-settings-button-secondary {
		width: 100%;
		text-align: center;
		justify-content: center;
	}

	.ch-profile-account-field,
	.ch-profile-badges-shell-item,
	.ch-profile-account-status-grid > div {
		padding: 13px;
	}
}


/* Community Hub Badges Mobile */
@media (max-width: 720px) {
	.ch-user-badges {
		gap:6px;
	}

	.ch-user-badge {
		font-size:11px;
		padding:5px 9px;
	}

	.ch-profile-badges-info-grid {
		grid-template-columns:1fr;
	}
}

/* Community Hub badge custom image support */
.ch-user-badge-img {
	width: 17px !important;
	height: 17px !important;
	object-fit: contain !important;
}


/* Mobile badge tooltip support */
@media (max-width: 782px) {
	.ch-user-badge-tooltip {
		max-width: min(250px, calc(100vw - 32px)) !important;
		font-size: 12px !important;
	}

	.ch-user-badges-feed,
	.ch-user-badges-comment,
	.ch-user-badges-embed {
		margin-left: 4px !important;
	}

	.ch-user-badges-feed .ch-user-badge,
	.ch-user-badges-comment .ch-user-badge,
	.ch-user-badges-embed .ch-user-badge {
		padding: 3px 6px !important;
	}
}

/* =========================================================
   COMMUNITY HUB MEMBER DIRECTORY MOBILE
   ========================================================= */

@media (max-width: 900px) {
  .ch-member-directory {
    max-width: 100%;
  }

  .ch-member-directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .ch-member-directory {
    padding: 0 10px;
  }

  .ch-member-directory-hero {
    display: grid;
    padding: 18px;
    border-radius: 20px;
  }

  .ch-member-directory-hero h1 {
    font-size: 28px;
  }

  .ch-member-directory-count {
    min-width: 0;
    width: 100%;
    display: block;
  }

  .ch-member-directory-search {
    display: grid;
    align-items: stretch;
  }

  .ch-member-directory-search button,
  .ch-member-directory-clear {
    width: 100%;
  }

  .ch-member-directory-grid {
    grid-template-columns: 1fr;
  }

  .ch-member-card-cover {
    height: 104px;
  }

  .ch-member-card-body {
    padding: 0 14px 14px;
  }

  .ch-member-directory-pagination {
    flex-wrap: wrap;
  }
}

/* Community Hub Single Post Mobile */
@media (max-width: 768px) {
  .ch-single-post-shell {
    width: 100% !important;
    max-width: 100% !important;
    margin: 14px auto 30px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .ch-single-post-header {
    border-radius: 16px !important;
    padding: 14px !important;
  }

  .ch-single-post-header h1 {
    font-size: 20px !important;
  }
}


/* Community Hub main feed route mobile */
@media (max-width: 768px) {
  .ch-community-feed-page {
    margin: 16px auto 32px;
    padding: 0 10px;
  }

  .ch-community-feed-header {
    max-width: 100%;
    border-radius: 16px;
    padding: 14px;
    align-items: flex-start;
    flex-direction: column;
  }

  .ch-community-feed-header h1 {
    font-size: 22px;
  }

  .ch-community-feed-header-link {
    width: 100%;
  }
}


/* Community Hub notifications route */
@media (max-width: 720px) {
	.ch-notifications-page {
		padding: 18px 12px 46px;
	}

	.ch-notifications-header {
		display: grid;
		gap: 14px;
	}

	.ch-notifications-actions {
		justify-content: stretch;
	}

	.ch-notifications-actions .ch-button,
	.ch-notifications-actions form,
	.ch-notifications-actions button {
		width: 100%;
	}

	.ch-notification-row {
		padding: 14px;
		border-radius: 14px;
	}
}


/* Community Hub internal navigation cleanup - mobile */
@media (max-width: 760px) {
  .ch-community-feed-header {
    align-items: stretch;
  }

  .ch-hub-page-nav,
  .ch-community-feed-nav,
  .ch-notifications-nav {
    width: 100%;
    justify-content: stretch;
  }

  .ch-community-feed-nav,
  .ch-notifications-nav {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .ch-hub-nav-button,
  a.ch-hub-nav-button {
    width: 100%;
    min-height: 42px;
  }

  .ch-member-directory-hero {
    display: grid;
  }

  .ch-member-directory-side {
    min-width: 0;
    width: 100%;
  }

  .ch-member-directory-nav {
    grid-template-columns: 1fr;
  }

  .ch-notifications-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

/* v1.0.95 touch interaction ownership for reactions. */
.ch-reaction-trigger,.ch-reaction-total{touch-action:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.ch-reaction-users-panel.is-mobile-sheet.is-visible{display:block!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important}
\n\n/* v1.0.109 — mobile active reaction emphasis.\n   Preserve the proven stable interaction while making the selected state\n   unmistakably intentional and premium on touch devices. */\n@media (max-width: 768px) {\n  .ch-action-row .ch-reaction-trigger.is-liked {\n    background: #2563eb !important;\n    color: #ffffff !important;\n    border-color: #2563eb !important;\n    border-radius: 999px !important;\n    font-weight: 900 !important;\n    box-shadow: 0 0 0 2px rgba(37,99,235,.26), 0 6px 16px rgba(37,99,235,.24) !important;\n    opacity: 1 !important;\n  }\n\n  .ch-action-row .ch-reaction-trigger.is-liked .ch-reaction-label,\n  .ch-action-row .ch-reaction-trigger.is-liked .ch-reaction-emoji {\n    color: #ffffff !important;\n  }\n\n  .ch-action-row .ch-reaction-trigger.is-liked .ch-reaction-icon-img {\n    opacity: 1 !important;\n    filter: none !important;\n  }\n}\n

/* v1.0.111 — mobile reaction micro-interaction polish only.
   These states are visual-only and do not alter the stable gesture contract. */
@media (max-width: 768px) {
  .ch-action-row .ch-reaction-trigger {
    transform: translateZ(0);
    transform-origin: center;
    transition:
      transform 150ms cubic-bezier(.2,.8,.2,1),
      box-shadow 180ms ease,
      background-color 180ms ease,
      color 180ms ease,
      border-color 180ms ease,
      opacity 140ms ease !important;
    will-change: transform;
  }

  .ch-action-row .ch-reaction-trigger.ch-reaction-pressing {
    transform: scale(.955);
  }

  .ch-action-row .ch-reaction-trigger.ch-reaction-celebrate {
    animation: ch-mobile-reaction-pop 340ms cubic-bezier(.16,1,.3,1) both;
  }

  .ch-action-row .ch-reaction-trigger.ch-reaction-celebrate .ch-reaction-emoji,
  .ch-action-row .ch-reaction-trigger.ch-reaction-celebrate .ch-reaction-icon-img {
    animation: ch-mobile-reaction-icon-pop 340ms cubic-bezier(.16,1,.3,1) both;
  }

  .ch-action-row .ch-reaction-trigger.is-liked {
    box-shadow: 0 0 0 2px rgba(37,99,235,.28), 0 7px 18px rgba(37,99,235,.26) !important;
  }
}

@keyframes ch-mobile-reaction-pop {
  0%   { transform: scale(.96); }
  48%  { transform: scale(1.075); }
  72%  { transform: scale(.995); }
  100% { transform: scale(1); }
}

@keyframes ch-mobile-reaction-icon-pop {
  0%   { transform: scale(.88) rotate(-4deg); }
  48%  { transform: scale(1.18) rotate(3deg); }
  100% { transform: scale(1) rotate(0); }
}

@media (prefers-reduced-motion: reduce) {
  .ch-action-row .ch-reaction-trigger,
  .ch-action-row .ch-reaction-trigger.ch-reaction-celebrate,
  .ch-action-row .ch-reaction-trigger.ch-reaction-celebrate .ch-reaction-emoji,
  .ch-action-row .ch-reaction-trigger.ch-reaction-celebrate .ch-reaction-icon-img {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}