/* Split from website/static/css/pages.css. Loaded after domain page styles to preserve the original late cascade. */

/* Primary CTA rhythm: align the main action buttons to the softer History interaction profile
   without changing generic btn-primary / btn-ghost behavior project-wide. */
#shop .shop-purchase-btn,
#shop .shop-payment-pay-btn,
.home-start-chat,
.profile-topup,
.login-telegram-btn {
  --primary-cta-rest-transform: scale(1);
  --primary-cta-hover-transform: scale(0.99);
  --primary-cta-active-transform: scale(0.97);
  transform: var(--primary-cta-rest-transform);
  transition: transform 0.15s ease, opacity 0.15s ease, box-shadow 0.2s ease, background 0.2s ease;
}

#shop .shop-purchase-btn {
  --primary-cta-rest-transform: translateX(-50%);
  --primary-cta-hover-transform: translateX(-50%) scale(0.99);
  --primary-cta-active-transform: translateX(-50%) scale(0.97);
}

#shop .shop-purchase-btn:hover:not(:disabled),
#shop .shop-payment-pay-btn:hover:not(:disabled),
.home-start-chat:hover,
.profile-topup:hover,
.login-telegram-btn:hover:not(:disabled) {
  transform: var(--primary-cta-hover-transform);
  opacity: 0.95;
}

#shop .shop-purchase-btn:active:not(:disabled),
#shop .shop-payment-pay-btn:active:not(:disabled),
.home-start-chat:active,
.profile-topup:active,
.login-telegram-btn:active:not(:disabled) {
  transform: var(--primary-cta-active-transform);
}

/* App-wide flatter visual refresh */
/* App-wide flatter visual refresh */

.home-search,
.home-favorites,
.home-favorite-card,
.profile-balance-card,
.profile-analytics-card,
.profile-transaction-overview,
.profile-transactions-detail,
#shop .shop-token-card,
#shop .shop-glass-panel {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}

.home-ai-card {
  background:
    radial-gradient(118% 86% at 50% -4%, var(--home-ai-tint) 0%, rgba(25, 27, 35, 0) 58%),
    linear-gradient(180deg, rgba(27, 29, 38, 0.98) 0%, rgba(25, 27, 35, 0.99) 100%);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}

.home-ai-card--mid {
  --home-ai-tint: rgba(15, 59, 142, 0.24);
}

.home-ai-card--voice {
  --home-ai-tint: rgba(29, 85, 78, 0.24);
}

.home-ai-card--bytedance {
  --home-ai-tint: rgba(90, 64, 18, 0.24);
}

.home-favorites {
  gap: 10px;
}

.home-favorites-header {
  background: transparent;
}

.home-favorites-list,
.history-list,
#chat_history .history-workspace-list,
.messages-container,
#shop .shop-token-input,
.model-modal-body,
.history-modal-body,
.profile-settings-body,
.chat-opened-modal-body,
.chat-opened-add-card,
.chat-opened-replace-card,
.chat-opened-add-list,
.chat-opened-replace-list,
.chat-opened-modal,
.chat-opened-modal .modal-card,
#chat_history .history-modal,
#chat_history .history-modal .modal-card,
#profile .history-modal,
#profile .history-modal .modal-card,
#profile-transactions .history-modal,
#profile-transactions .history-modal .modal-card,
.message-edit-card,
.image-preview-card {
  scrollbar-width: none !important;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
}

.home-favorites-list::-webkit-scrollbar,
.history-list::-webkit-scrollbar,
#chat_history .history-workspace-list::-webkit-scrollbar,
.messages-container::-webkit-scrollbar,
#shop .shop-token-input::-webkit-scrollbar,
.model-modal-body::-webkit-scrollbar,
.history-modal-body::-webkit-scrollbar,
.profile-settings-body::-webkit-scrollbar,
.chat-opened-modal-body::-webkit-scrollbar,
.chat-opened-add-card::-webkit-scrollbar,
.chat-opened-replace-card::-webkit-scrollbar,
.chat-opened-add-list::-webkit-scrollbar,
.chat-opened-replace-list::-webkit-scrollbar,
.chat-opened-modal::-webkit-scrollbar,
.chat-opened-modal .modal-card::-webkit-scrollbar,
#chat_history .history-modal::-webkit-scrollbar,
#chat_history .history-modal .modal-card::-webkit-scrollbar,
#profile .history-modal::-webkit-scrollbar,
#profile .history-modal .modal-card::-webkit-scrollbar,
#profile-transactions .history-modal::-webkit-scrollbar,
#profile-transactions .history-modal .modal-card::-webkit-scrollbar,
.message-edit-card::-webkit-scrollbar,
.image-preview-card::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  background: transparent;
}

#chat .top-bar {
  min-height: 52px;
}

.chat-open-add,
.chat-open-more {
  background: rgba(33, 35, 47, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.04);
  box-shadow: none;
}

.chat-open-add,
.chat-open-more {
  border-radius: 8px;
}

.chat-opened-limit {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}

.message-assistant-card {
  width: 100%;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

#chat .message-other:not(.message-image):not(.message-error) .message-assistant-card {
  padding: 0;
}

#chat .message-error .message-assistant-card--error {
  padding: 8px 10px 7px;
  background: linear-gradient(180deg, rgba(104, 40, 48, 0.18), rgba(46, 22, 32, 0.16));
  border: 1px solid rgba(255, 132, 151, 0.24);
  border-radius: 14px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.018);
}

.message-assistant-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-top: 6px;
}

.message-assistant-action {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: transparent;
  border: 1px solid transparent;
}

.message-assistant-action.is-feedback,
.message-user-action.is-feedback {
  background: transparent;
  border-color: transparent;
  color: rgba(248, 246, 255, 0.98);
  box-shadow: none;
}

.message-assistant-action.is-feedback:hover {
  background: transparent;
  border-color: transparent;
  color: rgba(248, 246, 255, 0.98);
}

.message-assistant-action.is-active {
  background: transparent;
  border-color: transparent;
  color: rgba(250, 248, 255, 0.98);
  box-shadow: none;
}

.message-assistant-action.is-feedback::before,
.message-user-action.is-feedback::before {
  background: rgba(190, 177, 255, 0.1);
  border-color: rgba(190, 177, 255, 0.22);
  box-shadow: 0 0 0 1px rgba(150, 122, 255, 0.08), 0 8px 20px rgba(70, 45, 140, 0.18);
}

.message-assistant-action.is-feedback:hover::before {
  background: rgba(190, 177, 255, 0.1);
  border-color: rgba(190, 177, 255, 0.22);
}

.message-assistant-action.is-active::before {
  background: rgba(190, 177, 255, 0.13);
  border-color: rgba(190, 177, 255, 0.3);
  box-shadow: 0 0 0 1px rgba(150, 122, 255, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.035);
}

.message-feedback-control .message-assistant-action {
  flex: 0 0 26px;
  width: 26px;
  min-width: 26px;
  transition: width 0.18s ease, min-width 0.18s ease, flex-basis 0.18s ease, opacity 0.16s ease, color 0.16s ease;
}

.message-feedback-control .message-assistant-action.is-feedback-collapsed {
  flex: 0 0 0;
  width: 0;
  min-width: 0;
  max-width: 0;
  flex-basis: 0;
  border-width: 0;
  opacity: 0;
  pointer-events: none;
}

#chat .message-feedback-control .message-assistant-action.is-feedback-collapsed {
  flex: 0 0 0;
  width: 0;
  min-width: 0;
  max-width: 0;
  flex-basis: 0;
  opacity: 0;
  pointer-events: none;
}

.message-assistant-action:active,
.message-user-action:active {
  transform: none;
}

.message-assistant-action:active::before {
  transform: scale(0.94);
}

.message-user-action:active::before {
  transform: scale(0.94);
}

.message-user-action.message-edit {
  background: transparent;
  border-color: transparent;
}

.message-user-card {
  box-shadow: none;
}

/* Final native text-selection guard for chat message bodies. */
#chat .message-user,
#chat .message-user .message-user-card,
#chat .message-user .message-content,
#chat .message-user .message-content *,
#chat .message-other,
#chat .message-other .message-assistant-card,
#chat .message-other .message-content,
#chat .message-other .message-content *,
#chat .message-error,
#chat .message-error .message-assistant-card,
#chat .message-error .message-content,
#chat .message-error .message-content * {
  -webkit-user-select: text !important;
  user-select: text !important;
  -webkit-touch-callout: default !important;
  cursor: text;
}

#chat .message-user .message-edit,
#chat .message-user .message-edit *,
#chat .message-assistant-actions,
#chat .message-assistant-actions *,
#chat .message-user-actions,
#chat .message-user-actions *,
#chat .message-attachment-card,
#chat .message-attachment-card *,
#chat .image-tile,
#chat .image-tile * {
  -webkit-user-select: none !important;
  user-select: none !important;
}

@media (hover: hover) and (pointer: fine) {
  body:not(.login-only),
  body:not(.login-only) .page,
  body:not(.login-only) .section,
  body:not(.login-only) p,
  body:not(.login-only) li,
  body:not(.login-only) blockquote,
  body:not(.login-only) pre,
  body:not(.login-only) code,
  body:not(.login-only) h1,
  body:not(.login-only) h2,
  body:not(.login-only) h3,
  body:not(.login-only) h4,
  body:not(.login-only) h5,
  body:not(.login-only) h6,
  body:not(.login-only) .message-content,
  body:not(.login-only) .message-content *,
  body:not(.login-only) .profile-transaction,
  body:not(.login-only) .profile-transaction *,
  body:not(.login-only) .image-generation-recent-title,
  body:not(.login-only) .image-generation-recent-empty,
  body:not(.login-only) .chat-opened-title,
  body:not(.login-only) .chat-balance-value {
    -webkit-user-select: text !important;
    user-select: text !important;
    -webkit-touch-callout: default !important;
  }

  body:not(.login-only) button,
  body:not(.login-only) button *,
  body:not(.login-only) input,
  body:not(.login-only) textarea,
  body:not(.login-only) select,
  body:not(.login-only) label,
  body:not(.login-only) [role="button"],
  body:not(.login-only) [role="button"] *,
  body:not(.login-only) [role="menuitem"],
  body:not(.login-only) [role="menuitem"] *,
  body:not(.login-only) .footer-nav,
  body:not(.login-only) .footer-nav *,
  body:not(.login-only) .message-attachment-card,
  body:not(.login-only) .message-attachment-card *,
  body:not(.login-only) .image-tile,
  body:not(.login-only) .image-tile * {
    -webkit-user-select: none !important;
    user-select: none !important;
  }
}

.image-preview-copy {
  background: rgba(255, 255, 255, 0.028);
  border-color: rgba(255, 255, 255, 0.05);
}

.message-edit-modal,
.image-preview-modal,
.chat-opened-modal,
#chat_history .history-modal,
#profile .history-modal,
#profile-transactions .history-modal,
#shop .shop-payment-modal,
.model-modal,
.app-bottom-sheet-modal {
  background: rgba(7, 9, 14, 0.52);
  backdrop-filter: blur(4px);
}

.message-edit-card,
.image-preview-card,
.chat-opened-modal .modal-card,
#chat_history .history-modal .modal-card,
#profile .history-modal .modal-card,
#profile-transactions .history-modal .modal-card,
.profile-settings-card,
#shop .shop-payment-sheet,
.model-modal .model-modal-card,
.chat-opened-add-card {
  background: rgba(32, 35, 46, 0.98);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(10px);
}

.chat-opened-modal .modal-card,
#chat_history .history-modal .modal-card,
#profile .history-modal .modal-card,
#profile-transactions .history-modal .modal-card,
.profile-settings-card,
.message-edit-card,
.image-preview-card {
  border-radius: 16px;
}

.image-preview-card {
  width: min(300px, calc(100vw - 32px));
  padding: 0;
  gap: 8px;
  background: transparent;
  border: none;
  border-radius: 14px;
  box-shadow: none;
  backdrop-filter: none;
}

.chat-opened-modal-close,
#chat_history .history-modal-close,
#profile .history-modal-close,
#profile-transactions .history-modal-close,
.profile-settings-card .history-modal-close,
.message-edit-close,
.image-preview-close,
.image-generation-detail-close,
.chat-opened-add-close,
.model-modal-header .model-modal-close {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: none;
}

.image-preview-close,
.image-generation-detail-close {
  background: rgba(24, 27, 36, 0.76);
  color: rgba(255, 255, 255, 0.76);
}

.chat-opened-modal-input,
.profile-settings-card .modal-input,
#chat_history .history-modal .modal-input,
#profile-transactions .history-modal .modal-input {
  background: rgba(255, 255, 255, 0.025);
  border-color: rgba(255, 255, 255, 0.06);
  box-shadow: none;
}

.chat-opened-modal-input:focus,
.profile-settings-card .modal-input:focus,
#chat_history .history-modal .modal-input:focus,
#profile-transactions .history-modal .modal-input:focus {
  border-color: rgba(124, 92, 255, 0.34);
  box-shadow: 0 0 0 1px rgba(124, 92, 255, 0.14);
}

.chat-opened-modal .modal-btn.primary,
.chat-opened-modal .modal-btn.danger,
#chat_history .history-modal .modal-btn.primary,
#chat_history .history-modal .modal-btn.danger,
#profile .history-modal .modal-btn.primary,
#profile-transactions .history-modal .modal-btn.primary,
#profile-transactions .history-modal .modal-btn.danger,
.profile-settings-card .modal-btn.primary {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.07);
}

.chat-opened-modal .modal-btn.secondary,
#chat_history .history-modal .modal-btn.secondary,
#profile .history-modal .modal-btn.secondary,
#profile-transactions .history-modal .modal-btn.secondary,
.profile-settings-card .modal-btn.secondary {
  background: rgba(255, 255, 255, 0.025);
}

.model-modal {
  padding: 14px 14px calc(14px + env(safe-area-inset-bottom));
}

.model-modal .model-modal-card {
  width: min(100%, 372px);
  max-height: min(72dvh, 520px);
  padding: 14px;
  gap: 10px;
}

.model-modal-title {
  font-size: 16px;
  line-height: 20px;
}

.model-groups {
  gap: 10px;
}

.model-group-title {
  color: rgba(242, 243, 247, 0.38);
}

.model-options {
  gap: 7px;
}

.model-option {
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.026);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: none;
}

.model-option:hover:not(:disabled) {
  transform: scale(0.995);
  opacity: 0.98;
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: none;
}

.model-option-main {
  gap: 10px;
}

.model-option-icon-tile {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(124, 92, 255, 0.12);
  border: 1px solid rgba(124, 92, 255, 0.12);
  box-shadow: none;
}

.model-option[data-accent='teal'] .model-option-icon-tile {
  background: rgba(67, 188, 179, 0.12);
  border-color: rgba(67, 188, 179, 0.12);
}

.model-option[data-accent='blue'] .model-option-icon-tile,
.model-option[data-accent='indigo'] .model-option-icon-tile,
.model-option[data-accent='slate'] .model-option-icon-tile {
  background: rgba(95, 135, 255, 0.12);
  border-color: rgba(95, 135, 255, 0.12);
}

.model-option-icon,
.model-option-icon svg {
  width: 18px;
  height: 18px;
}

.model-option-label {
  font-size: 14px;
  font-weight: 600;
}

.model-option-subtitle {
  font-size: 11px;
  color: rgba(242, 243, 247, 0.46);
}

.model-option-status {
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 10px;
}

.model-option-status.is-active {
  background: rgba(124, 92, 255, 0.14);
  border-color: rgba(124, 92, 255, 0.22);
  color: rgba(240, 236, 255, 0.96);
}

.model-option.active {
  border-color: rgba(124, 92, 255, 0.34);
  background: rgba(124, 92, 255, 0.08);
  box-shadow: inset 0 0 0 1px rgba(124, 92, 255, 0.08);
}

#shop .shop-token-card {
  border-radius: 16px;
}

#shop .shop-credit-option {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
}

#shop .shop-credit-option.active {
  background: rgba(124, 92, 255, 0.12);
  color: #f5f7ff;
  box-shadow: none;
  border-color: rgba(124, 92, 255, 0.22);
}

#shop .shop-slider-thumb {
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.14);
}

#shop .shop-payment-modal.open {
  background: rgba(7, 9, 14, 0.52);
}

#shop .shop-payment-sheet {
  min-height: 392px;
  gap: 20px;
  padding: 28px 16px calc(92px + env(safe-area-inset-bottom));
  background: rgba(24, 27, 36, 0.98);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 18px 18px 0 0;
}

#shop .shop-payment-sheet::before {
  display: none;
}

body.tg-fullscreen #shop .shop-payment-sheet {
  padding-top: calc(28px + var(--app-telegram-fullscreen-header-inset, var(--tg-top-inset, 0px)));
}

#shop .shop-payment-option {
  min-height: 46px;
  padding: 11px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  box-shadow: none;
}

#shop .shop-payment-option:hover {
  background: rgba(255, 255, 255, 0.05);
}

#shop .shop-payment-option.is-selected {
  border-color: rgba(124, 92, 255, 0.3);
  background: rgba(124, 92, 255, 0.08);
  box-shadow: inset 0 0 0 1px rgba(124, 92, 255, 0.08);
}

#shop .shop-payment-option:focus-visible,
#shop .shop-payment-pay-btn:focus-visible {
  box-shadow: 0 0 0 2px rgba(124, 92, 255, 0.26);
}

#shop .shop-payment-pay-btn {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.14);
}

.profile-settings-card,
.profile-analytics-card,
.profile-balance-card,
.profile-transaction-overview,
.profile-transactions-detail,
.profile-range-dropdown,
.profile-analytics-legend-item {
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}

.profile-settings-card,
.profile-range-dropdown,
.profile-analytics-card,
.profile-balance-card,
.profile-transaction-overview,
.profile-transactions-detail,
.profile-analytics-legend-item {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.06);
}

.profile-topup,
.profile-filter-toggle,
.profile-settings-trigger,
.profile-transactions-back,
.profile-session-action,
.profile-settings-avatar-btn,
.profile-range-dropdown__action,
.profile-analytics-range-chip,
.profile-analytics-range-clear {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.06);
  box-shadow: none;
}

.profile-transaction-filter.is-active,
.profile-transaction-range.is-active,
.profile-analytics-legend-item.is-selected,
.profile-filter-toggle.active {
  border-color: rgba(124, 92, 255, 0.22);
  background: rgba(124, 92, 255, 0.1);
  box-shadow: none;
}

button:focus,
button:focus-visible,
input:focus,
input:focus-visible,
textarea:focus,
textarea:focus-visible,
select:focus,
select:focus-visible,
[role="button"]:focus,
[role="button"]:focus-visible {
  outline: none !important;
}

button,
input,
textarea,
select,
[role="button"] {
  -webkit-tap-highlight-color: transparent;
}

/* Chat-scale design-system overrides.
   Keep secondary surfaces aligned to the compact text-chat controls instead of
   letting each page drift into its own oversized button/menu scale. */
.ui-chat-scale-icon-button,
.profile-settings-trigger,
.profile-transactions-back,
.notification-icon-button,
#chat_history .history-modal-close,
#profile .history-modal-close,
#profile-transactions .history-modal-close,
.profile-settings-card .history-modal-close {
  width: var(--ui-chat-header-icon-button-size);
  height: var(--ui-chat-header-icon-button-size);
  flex: 0 0 var(--ui-chat-header-icon-button-size);
  border-radius: calc(var(--ui-chat-control-radius) + 2px);
}

.ui-chat-scale-icon-button svg,
.profile-settings-trigger svg,
.profile-transactions-back svg,
.notification-icon-button svg,
#chat_history .history-modal-close svg,
#profile .history-modal-close svg,
#profile-transactions .history-modal-close svg,
.profile-settings-card .history-modal-close svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

#chat_history .history-menu {
  min-width: 148px;
  padding: 5px;
  border-radius: 13px;
  gap: 4px;
}

.image-generation-action-menu {
  min-width: 148px;
  padding: 5px;
  border-radius: 13px;
  gap: 4px;
}

#chat_history .menu-option,
.message-image-menu-item,
.image-preview-menu-item,
.image-generation-action-menu-item,
.notifications-menu-item {
  min-height: 0;
  grid-template-columns: var(--ui-chat-menu-icon-size) minmax(0, 1fr);
  font-size: 12px;
  font-weight: 500;
  padding: var(--ui-chat-menu-item-pad-y) var(--ui-chat-menu-item-pad-x);
  gap: 10px;
  border-radius: calc(var(--ui-chat-control-radius) + 2px);
}

#chat_history .history-menu-icon,
.message-image-menu-item span:first-child,
.image-preview-menu-item span:first-child,
.image-generation-action-menu-item span:first-child,
.notifications-menu-item span:first-child {
  width: var(--ui-chat-menu-icon-size);
  height: var(--ui-chat-menu-icon-size);
  min-width: var(--ui-chat-menu-icon-size);
  flex: 0 0 var(--ui-chat-menu-icon-size);
}

#chat_history .history-menu-icon svg,
.message-image-menu-item svg,
.image-preview-menu-item svg,
.image-generation-action-menu-item svg,
.notifications-menu-item svg {
  width: var(--ui-chat-menu-icon-size);
  height: var(--ui-chat-menu-icon-size);
  max-width: var(--ui-chat-menu-icon-size);
  max-height: var(--ui-chat-menu-icon-size);
}

.message-regenerate-menu-item {
  min-height: 0;
  grid-template-columns: 15px minmax(0, 1fr);
  font-size: 12px;
  font-weight: 500;
  padding: 6px 8px;
  gap: 8px;
  border-radius: 8px;
}

.message-regenerate-menu-item span:first-child {
  width: 15px;
  height: 15px;
  min-width: 15px;
  flex: 0 0 15px;
}

.message-regenerate-menu-item svg {
  width: 15px;
  height: 15px;
  max-width: 15px;
  max-height: 15px;
}

#support-chat-section .support-chat-new-btn,
#shop .shop-credit-option,
.profile-settings-avatar-btn,
.profile-settings-choice,
.notification-action {
  min-height: var(--ui-chat-pill-height);
  padding-inline: var(--ui-chat-pill-pad-x);
  border-radius: var(--ui-chat-control-radius);
}

.profile-session-action,
.profile-settings-card .modal-btn,
#shop .shop-payment-option {
  min-height: calc(var(--ui-chat-pill-height) + 6px);
  border-radius: calc(var(--ui-chat-control-radius) + 4px);
}

/* Chat-scale second pass: normalize missed non-chat page controls without
   changing page-specific content hierarchy. */
.history-search,
.home-search,
.help-search {
  min-height: var(--ui-chat-search-height);
  height: auto;
  padding: 4px 10px;
  gap: 10px;
  border-radius: calc(var(--ui-chat-control-radius) + 4px);
}

.history-search .search-icon,
.home-search-icon,
.help-search-icon {
  width: var(--ui-chat-header-icon-button-size);
  height: var(--ui-chat-header-icon-button-size);
  flex: 0 0 var(--ui-chat-header-icon-button-size);
  padding: 0;
}

.history-search .search-icon svg,
.home-search-icon svg,
.help-search-icon svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.home-search-input,
.help-search-input,
.history-search input {
  width: 100%;
  min-width: 0;
  height: auto;
  flex: 1 1 auto;
  font-size: 13px;
  line-height: 18px;
}

.home-ai-card,
.help-contact-card,
.help-feedback-card,
.help-faq-item,
.profile-balance-card,
.profile-analytics-card,
#shop .shop-glass-panel {
  border-radius: var(--ui-chat-card-radius);
  padding: var(--ui-chat-card-pad);
}

.home-ai-card {
  flex-basis: 138px;
  min-height: 154px;
  gap: 14px;
}

.home-ai-icon,
.home-favorite-icon {
  width: var(--ui-chat-icon-button-size);
  height: var(--ui-chat-icon-button-size);
}

.home-ai-icon svg,
.home-favorite-icon svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.home-favorites {
  border-radius: var(--ui-chat-card-radius);
  padding: var(--ui-chat-card-pad);
  gap: 8px;
}

.help-contact-card {
  min-height: 112px;
  gap: 10px;
}

.help-feedback-card {
  min-height: var(--ui-chat-row-min-height);
}

.help-card-icon {
  width: var(--ui-chat-header-icon-button-size);
  height: var(--ui-chat-header-icon-button-size);
  border-radius: calc(var(--ui-chat-control-radius) + 2px);
}

.help-card-icon svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.help-faq-trigger {
  padding: 12px;
}

.help-faq-question {
  font-size: 14px;
  line-height: 18px;
}

.help-faq-answer p {
  padding: 0 12px 12px;
  font-size: 13px;
  line-height: 18px;
}

.history-row,
.workspace-row,
.profile-transaction,
.profile-transaction-skeleton,
.support-chat-chip {
  min-height: var(--ui-chat-row-min-height);
  padding-block: 10px;
  gap: 12px;
}

.history-tabs {
  margin: 12px 0 10px;
  border-radius: calc(var(--ui-chat-control-radius) + 4px);
}

.history-tabs .tab {
  min-height: var(--ui-chat-pill-height);
  padding: 0 10px;
  font-size: 13px;
  line-height: 18px;
}

.history-icon,
.workspace-logo,
.profile-transaction-badge {
  width: var(--ui-chat-header-icon-button-size);
  height: var(--ui-chat-header-icon-button-size);
  flex: 0 0 var(--ui-chat-header-icon-button-size);
  border-radius: calc(var(--ui-chat-control-radius) + 2px);
}

.history-icon svg,
.workspace-logo svg,
.profile-transaction-badge svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.history-title,
.workspace-title,
.profile-transaction-title {
  font-size: 15px;
  line-height: 19px;
}

.shop-tooltip-trigger,
.profile-filter-toggle,
.profile-analytics-range-clear,
.home-favorite-star,
.star,
.dot-menu {
  width: var(--ui-chat-icon-button-size);
  height: var(--ui-chat-icon-button-size);
  flex: 0 0 var(--ui-chat-icon-button-size);
  border-radius: calc(var(--ui-chat-control-radius) + 2px);
}

.shop-tooltip-trigger svg,
.profile-filter-toggle svg,
.profile-analytics-range-clear svg,
.home-favorite-star svg,
.star svg,
.dot-menu svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.support-chat-back {
  width: var(--ui-chat-header-icon-button-size);
  height: var(--ui-chat-header-icon-button-size);
  flex: 0 0 var(--ui-chat-header-icon-button-size);
}

.support-chat-back svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.home-start-chat,
.start-chat-card,
.profile-topup,
#shop .shop-purchase-btn,
#shop .shop-payment-pay-btn,
#shop .shop-payment-option,
#chat_history .history-modal .modal-btn,
#chat_history .history-workspace-option {
  min-height: var(--ui-chat-cta-height);
  height: auto;
  border-radius: calc(var(--ui-chat-control-radius) + 4px);
}

.home-start-chat {
  padding: 10px 12px;
}

.home-start-chat svg,
.profile-topup-icon svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.profile-topup {
  padding-inline: var(--ui-chat-pill-pad-x);
  gap: 7px;
}

#shop .shop-purchase-btn,
#shop .shop-payment-pay-btn {
  padding-block: 10px;
}

.profile-transaction-filter,
.profile-transaction-range,
.profile-analytics-range-chip,
.profile-range-dropdown__action,
.notification-title-toggle {
  min-height: var(--ui-chat-pill-height);
  padding-inline: var(--ui-chat-pill-pad-x);
}

.notification-title-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--ui-chat-control-radius);
}

.help-view-all,
.home-favorites-link,
.image-generation-view-all,
.profile-view-all-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  height: auto;
  appearance: none;
  border: none;
  background: transparent;
  color: rgba(194, 180, 255, 0.92);
  font-size: 13px;
  line-height: 1.1;
  font-weight: 500;
  padding: 0;
  opacity: 1;
  cursor: pointer;
  transition: opacity 0.16s ease, transform 0.16s ease, color 0.16s ease;
}

.help-view-all:hover,
.help-view-all:focus-visible,
.home-favorites-link:hover,
.home-favorites-link:focus-visible,
.image-generation-view-all:hover,
.image-generation-view-all:focus-visible,
.profile-view-all-link:hover,
.profile-view-all-link:focus-visible {
  color: rgba(232, 225, 255, 0.98);
  opacity: 1;
}

.help-view-all:focus-visible,
.home-favorites-link:focus-visible,
.image-generation-view-all:focus-visible,
.profile-view-all-link:focus-visible {
  outline: none;
}

.help-view-all:active,
.home-favorites-link:active,
.image-generation-view-all:active,
.profile-view-all-link:active {
  transform: scale(0.98);
  opacity: 0.82;
}

#chat_history .history-modal .modal-btn {
  padding-block: 10px;
}

#chat_history .history-workspace-option {
  padding: 10px 12px;
}

.profile-transaction-filters,
.profile-transaction-ranges {
  padding: 4px;
  border-radius: var(--ui-chat-card-radius);
}

.profile-segmented-pill {
  border-radius: calc(var(--ui-chat-control-radius) + 3px);
}

.profile-analytics-legend-item {
  min-height: calc(var(--ui-chat-row-min-height) - 6px);
  padding: 8px 10px;
  border-radius: calc(var(--ui-chat-control-radius) + 4px);
}

#shop .shop-token-card {
  height: 78px;
  border-radius: var(--ui-chat-card-radius);
}

#shop .shop-token-display,
#shop .shop-token-input {
  font-size: clamp(38px, 12vw, 48px);
}

#shop .shop-slider-thumb {
  width: 18px;
  height: 18px;
}

#shop .shop-tooltip-content {
  border-radius: calc(var(--ui-chat-control-radius) + 2px);
  padding: 8px 10px;
  font-size: 12px;
  line-height: 16px;
}

#shop .shop-payment-sheet {
  gap: 16px;
  padding-top: 24px;
}

#shop .shop-payment-title {
  font-size: 18px;
  line-height: 23px;
}

#shop .shop-payment-sparkle,
#shop .shop-payment-option-icon {
  width: var(--ui-chat-icon-button-size);
  height: var(--ui-chat-icon-button-size);
}

#shop .shop-payment-sparkle svg,
#shop .shop-payment-option-icon svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.notification-card {
  border-radius: var(--ui-chat-card-radius);
  padding: var(--ui-chat-card-pad);
  gap: 12px;
}

/* Chat-scale rhythm pass: align page spacing after controls were compacted. */
.home-screen,
#shop .shop-content,
.profile-shell,
.profile-transactions-shell,
.notifications-shell,
.help-shell {
  gap: var(--ui-chat-section-gap);
  padding-top: var(--ui-chat-section-gap);
}

#chat_history .history-controls-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: var(--ui-chat-page-gap);
  margin-bottom: var(--ui-chat-stack-gap);
}

#chat_history .history-controls-row .history-tabs {
  flex: 0 0 156px;
  margin: 0;
}

#chat_history .history-controls-row .history-search {
  flex: 1 1 auto;
  min-width: 0;
  margin-top: 0;
}

#chat_history .history-tabs {
  --history-tab-indicator-left: 3px;
  --history-tab-indicator-width: 0px;
  display: flex;
  align-items: center;
  height: 38px;
  margin: var(--ui-chat-page-gap) 0 var(--ui-chat-stack-gap);
  padding: 3px;
  border-radius: calc(var(--ui-chat-control-radius) + 4px);
  overflow: hidden;
}

#chat_history .history-tabs .active-indicator {
  top: 3px;
  bottom: 3px;
  left: var(--history-tab-indicator-left);
  width: var(--history-tab-indicator-width);
  margin: 0;
  border-radius: calc(var(--ui-chat-control-radius) + 1px);
  transform: none;
  opacity: 0;
  transition: none;
}

#chat_history .history-tabs.is-tab-indicator-ready .active-indicator {
  opacity: 1;
}

#chat_history .history-tabs.is-tab-indicator-animated .active-indicator {
  transition: left 0.18s ease, width 0.18s ease, background 0.18s ease, transform 90ms ease, filter 90ms ease;
}

#chat_history .history-tabs.workspace-active .active-indicator {
  transform: none;
}

#chat_history .history-tabs:has(.tab:active) .active-indicator {
  transform: scale(0.965);
  filter: brightness(0.96);
}

#chat_history .history-tabs .tab {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  width: auto;
  padding: 0 11px;
  font-size: 12px;
  line-height: 16px;
}

.start-chat-card,
#shop .shop-purchase-btn {
  width: var(--ui-chat-bottom-cta-width);
  max-width: var(--ui-chat-bottom-cta-max-width);
  min-height: var(--ui-chat-cta-height);
  padding: 10px 12px;
}

.start-chat-card {
  gap: 8px;
}

.start-chat-text {
  font-size: 15px;
  line-height: 19px;
}

.start-chat-icon svg {
  width: var(--ui-chat-icon-size);
  height: var(--ui-chat-icon-size);
}

.profile-transaction-overview:empty,
.profile-transactions-detail:empty {
  display: none;
}

.profile-transaction-overview,
.profile-transactions-detail {
  gap: var(--ui-chat-stack-gap);
}

.help-contact-grid,
.notifications-groups,
.notifications-card-list,
.profile-transactions,
.history-list {
  gap: var(--ui-chat-stack-gap);
}

.help-feedback-card,
.help-faq-section {
  margin-top: 0;
}

#guide-section > .card {
  margin-top: var(--ui-chat-section-gap);
  border-radius: var(--ui-chat-card-radius);
  padding: var(--ui-chat-card-pad) !important;
}

#guide-section .grid {
  gap: var(--ui-chat-stack-gap) !important;
}

#guide-section .grid > .card {
  border-radius: calc(var(--ui-chat-control-radius) + 4px);
  padding: var(--ui-chat-card-pad) !important;
}

#profile .profile-topup {
  background: #ffffff;
  color: #0f131b;
  border-color: rgba(12, 15, 24, 0.06);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
}

#profile .profile-topup svg path {
  fill: currentColor;
}

#profile .profile-topup:hover {
  background: #f2f2f2;
  color: #0f131b;
  opacity: 0.95;
  transform: var(--primary-cta-hover-transform);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.2);
}

#profile .profile-topup:active {
  background: #e9e9e9;
  transform: var(--primary-cta-active-transform);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18);
}

#profile .profile-topup:focus-visible {
  outline: none;
  border-color: rgba(255, 255, 255, 0.42);
  box-shadow: 0 0 0 2px rgba(124, 92, 255, 0.28), 0 8px 18px rgba(0, 0, 0, 0.18);
}
