/* QQ 独立 UI 页面：此区块为唯一 QQ 样式源。
       仅复用 route-page 的路由显隐协议；页面布局保持 QQ 独立，但接入全局字体、显示缩放与界面主题变量。
       QQ 常规功能图标使用 Lucide SVG；等级标识与聊天拓展功能面板默认使用 Font Awesome Classic Solid 内联 SVG；聊天输出暂停态按交互规范使用 Lucide。
       头像与频道媒体只保留纯色占位。 */
    #page-qq-app {
      --qq-blue: var(--qq-theme-accent, #0aa7ee);
      --qq-header: #eef3ff;
      --qq-bg: #f2f3f5;
      --qq-surface: #ffffff;
      --qq-soft: #f6f8fd;
      --qq-text: #101217;
      --qq-line: #eeeeef;
      --qq-frame-width: 100%;
      --qq-chat-avatar-size: calc(30px * var(--display-scale));
      --qq-chat-bubble-min-height: calc(28px * var(--display-scale));
      font-variation-settings: "wght" var(--user-font-weight);
      position: relative;
      isolation: isolate;
      width: 100%;
      height: 100%;
      min-width: 0;
      min-height: 0;
      grid-template: minmax(0, 1fr) / minmax(0, 1fr);
      justify-items: stretch;
      overflow: hidden;
      background: var(--qq-bg);
      color: var(--qq-text);
      font-family: var(--user-font-family);
      font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: var(--user-font-weight);
      line-height: 1.4;
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
      touch-action: pan-y;
      overscroll-behavior-x: contain;
    }

    #page-qq-app .qq-main-view {
      position: relative;
      grid-area: 1 / 1;
      width: 100%;
      height: 100%;
      min-width: 0;
      min-height: 0;
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      justify-items: center;
      overflow: hidden;
      background: var(--qq-bg);
      touch-action: pan-y;
    }

    #page-qq-app[data-qq-view="side"] .qq-main-view {
      display: none;
    }

    /* QQ controls inherit the app font, but global parent-page titles must keep
       the single global .parent-page-title typography from core.css. */
    #page-qq-app :where(button:not(.parent-page-title), input, textarea) {
      margin: 0;
      font: inherit;
      color: inherit;
      -webkit-tap-highlight-color: transparent;
    }

    #page-qq-app button {
      appearance: none;
      -webkit-appearance: none;
    }

    #page-qq-app .qq-lucide-svg {
      display: block;
      width: 100%;
      height: 100%;
      overflow: visible;
      shape-rendering: geometricPrecision;
      vector-effect: non-scaling-stroke;
    }

    #page-qq-app .qq-header {
      width: min(100%, var(--qq-frame-width));
      min-height: 64px;
      padding: 0 14px 7px;
      display: flex;
      align-items: center;
      gap: 8px;
      background: var(--qq-header);
    }

    #page-qq-app .qq-header-avatar {
      width: 32px;
      height: 32px;
      flex: 0 0 32px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: #dedfe2;
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .035);
      cursor: pointer;
    }

    #page-qq-app .qq-header-copy {
      min-width: 0;
      flex: 1;
    }

    #page-qq-app .qq-header-title {
      margin: 0;
      font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      line-height: 1.14;
      letter-spacing: -.01em;
    }

    #page-qq-app .qq-header-subtitle {
      display: flex;
      align-items: center;
      gap: 4px;
      margin-top: 3px;
      color: #34373d;
      font-size: calc(9px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1;
    }

    #page-qq-app .qq-header-subtitle[hidden] {
      display: none;
    }

    #page-qq-app .qq-online-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #16cf78;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
    }

    #page-qq-app .qq-header-actions,
    #page-qq-app .qq-head-group {
      display: flex;
      align-items: center;
    }

    #page-qq-app .qq-header-actions {
      gap: 2px;
    }

    #page-qq-app .qq-head-group {
      display: none;
      gap: 2px;
    }

    #page-qq-app .qq-head-group.is-active {
      display: flex;
    }

    #page-qq-app .qq-head-action {
      width: 29px;
      height: 29px;
      padding: 4px;
      border: 0;
      background: transparent;
      color: #111317;
      display: grid;
      place-items: center;
      cursor: pointer;
    }

    #page-qq-app .qq-head-action .qq-lucide-svg {
      width: 21px;
      height: 21px;
      stroke-width: 1.9;
    }

    #page-qq-app .qq-head-action[data-qq-action="plus"] .qq-lucide-svg {
      width: 23px;
      height: 23px;
      stroke-width: 1.55;
    }

    #page-qq-app .qq-body {
      width: min(100%, var(--qq-frame-width));
      min-height: 0;
      overflow: hidden;
      border-radius: 18px 18px 0 0;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-panel {
      display: none;
      height: 100%;
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
      background: var(--qq-surface);
    }
#page-qq-app .qq-panel.is-active {
      display: block;
    }

    #page-qq-app .qq-panel[data-qq-panel="messages"] {
      background: var(--qq-bg);
    }

    #page-qq-app .qq-search-wrap {
      padding: 11px 15px 10px;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-search-box {
      height: 34px;
      border: 0;
      border-radius: 11px;
      background: var(--qq-soft);
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 5px;
      color: #9ca0a8;
    }

    #page-qq-app .qq-search-icon {
      width: 16px;
      height: 16px;
      flex: 0 0 16px;
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-search-icon .qq-lucide-svg {
      stroke-width: 1.65;
    }

    #page-qq-app .qq-search-box input {
      width: 2em;
      min-width: 2em;
      max-width: calc(100% - 52px);
      field-sizing: content;
      height: 34px;
      padding: 0;
      border: 0;
      outline: 0;
      background: transparent;
      color: #202226;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 34px;
      text-align: left;
    }

    #page-qq-app .qq-search-box input::placeholder {
      color: #9ca0a8;
      opacity: 1;
    }

    #page-qq-app .qq-account-row {
      width: 100%;
      min-height: 84px;
      padding: 14px 15px;
      border: 0;
      background: var(--qq-surface);
      display: grid;
      grid-template-columns: 45px minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-account-icon {
      position: relative;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      background: var(--qq-blue);
      color: #fff;
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-account-icon > .qq-lucide-svg {
      width: 27px;
      height: 27px;
      stroke-width: 1.35;
    }

    #page-qq-app .qq-account-icon > .qq-account-logo {
      width: 26px;
      height: 30px;
      display: block;
      fill: currentColor;
    }

    #page-qq-app .qq-account-link {
      position: absolute;
      right: -1px;
      bottom: -1px;
      width: 19px;
      height: 19px;
      padding: 4px;
      border-radius: 50%;
      background: var(--qq-blue);
      color: #fff;
      box-shadow: 0 0 0 2px var(--qq-surface);
    }

    #page-qq-app .qq-account-link .qq-lucide-svg {
      stroke-width: 2;
    }

    #page-qq-app .qq-account-copy {
      min-width: 0;
    }

    #page-qq-app .qq-account-copy strong {
      display: block;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      line-height: 1.25;
    }

    #page-qq-app .qq-account-copy small {
      display: block;
      margin-top: 4px;
      color: #9a9ca3;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
    }

    #page-qq-app .qq-account-count {
      align-self: start;
      padding-top: 4px;
      color: #c2c4c9;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
    }

    #page-qq-app .qq-message-list {
      min-height: 360px;
      padding-bottom: 24px;
      background: var(--qq-bg);
    }

    #page-qq-app .qq-message-list[aria-busy="true"] {
      pointer-events: none;
    }

    #page-qq-app .qq-conversation-row {
      width: 100%;
      min-height: 72px;
      padding: 11px 15px;
      border: 0;
      background: var(--qq-surface);
      color: var(--qq-text);
      display: grid;
      grid-template-columns: 48px minmax(0, 1fr) auto;
      grid-template-areas:
        "avatar name time"
        "avatar preview preview";
      align-items: center;
      column-gap: 11px;
      row-gap: 4px;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-conversation-row + .qq-conversation-row {
      border-top: 1px solid rgba(28, 30, 34, .055);
    }

    #page-qq-app .qq-conversation-row:active {
      background: var(--qq-soft);
    }

    #page-qq-app .qq-conversation-avatar {
      grid-area: avatar;
      width: 48px;
      height: 48px;
      overflow: hidden;
      border-radius: 50%;
      background: linear-gradient(145deg, #d8e7f4, #c6d6e5);
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
      display: grid;
      place-items: center;
      color: #627283;
      font-size: 18px;
      font-weight: 650;
    }

    #page-qq-app .qq-conversation-avatar img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    #page-qq-app .qq-conversation-name {
      grid-area: name;
      min-width: 0;
      align-self: end;
      overflow: hidden;
      color: var(--qq-text);
      font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      line-height: 1.2;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #page-qq-app .qq-conversation-time {
      grid-area: time;
      align-self: end;
      color: #a0a3a9;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.2;
      white-space: nowrap;
    }

    #page-qq-app .qq-conversation-preview {
      grid-area: preview;
      min-width: 0;
      align-self: start;
      overflow: hidden;
      color: #8d9097;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.25;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #page-qq-app .qq-message-empty-state {
      min-height: 280px;
      padding: 92px 24px 24px;
      color: #a0a3aa;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.6;
      text-align: center;
    }

    #page-qq-app .qq-simple-row {
      position: relative;
      width: 100%;
      min-height: 48px;
      padding: 0 15px;
      border: 0;
      background: var(--qq-surface);
      color: var(--qq-text);
      display: flex;
      align-items: center;
      gap: 10px;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-simple-row + .qq-simple-row::before {
      content: "";
      position: absolute;
      left: 15px;
      right: 0;
      top: 0;
      height: 1px;
      background: var(--qq-line);
    }

    #page-qq-app .qq-simple-row-label {
      min-width: 0;
      flex: 1;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-row-chevron {
      width: 14px;
      height: 14px;
      color: #92969b;
    }

    #page-qq-app .qq-row-chevron .qq-lucide-svg {
      stroke-width: 1.5;
    }

    #page-qq-app .qq-section-divider {
      height: 8px;
      background: var(--qq-soft);
    }

    #page-qq-app .qq-contact-tabs {
      position: sticky;
      top: 0;
      z-index: 1;
      height: 48px;
      background: var(--qq-surface);
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      border-bottom: 1px solid #f1f1f1;
    }

    #page-qq-app .qq-contact-tab {
      position: relative;
      border: 0;
      background: transparent;
      color: #17191d;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      cursor: pointer;
    }

    #page-qq-app .qq-contact-tab.is-active {
      font-weight: 650;
    }

    #page-qq-app .qq-contact-tab.is-active::after {
      content: "";
      position: absolute;
      left: 50%;
      bottom: 0;
      width: 30px;
      height: 3px;
      border-radius: 999px;
      background: var(--qq-blue);
      transform: translateX(-50%);
    }

    #page-qq-app .qq-contact-content {
      min-height: 180px;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-contact-pane {
      display: none;
    }

    #page-qq-app .qq-contact-pane.is-active {
      display: block;
    }

    #page-qq-app .qq-group-row {
      width: 100%;
      min-height: 52px;
      padding: 0 16px;
      border: 0;
      background: var(--qq-surface);
      color: var(--qq-text);
      display: grid;
      grid-template-columns: 12px minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-expand-icon {
      width: 10px;
      height: 10px;
      color: #9ea1a7;
      transform: rotate(90deg);
    }

    #page-qq-app .qq-expand-icon .qq-lucide-svg {
      fill: currentColor;
      stroke-width: 1.3;
    }

    #page-qq-app .qq-group-name {
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-group-count {
      color: #96999f;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-contact-placeholder {
      padding: 32px 24px;
      color: #9ca0a8;
      text-align: center;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-contact-item {
      position: relative;
      width: 100%;
      min-height: 62px;
      padding: 8px 16px;
      border: 0;
      background: var(--qq-surface);
      color: var(--qq-text);
      display: grid;
      grid-template-columns: 44px minmax(0, 1fr);
      align-items: center;
      gap: 11px;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-contact-item + .qq-contact-item::before {
      content: "";
      position: absolute;
      left: 71px;
      right: 0;
      top: 0;
      height: 1px;
      background: var(--qq-line);
    }

    #page-qq-app .qq-contact-item-avatar {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      overflow: hidden;
      display: block;
      background: var(--qq-soft);
    }

    #page-qq-app .qq-contact-item-avatar img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    #page-qq-app .qq-contact-item-copy {
      min-width: 0;
      display: grid;
      gap: 3px;
    }

    #page-qq-app .qq-contact-item-name {
      overflow: hidden;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      line-height: 1.3;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-contact-item-meta {
      min-width: 0;
      overflow: hidden;
      color: #96999f;
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.3;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-contact-group-block {
      background: var(--qq-surface);
    }

    #page-qq-app .qq-contact-group-block:not(.is-expanded) .qq-group-contacts {
      display: none;
    }

    #page-qq-app .qq-contact-group-block.is-expanded .qq-expand-icon {
      transform: rotate(180deg);
    }

    #page-qq-app .qq-contact-group-block:not(.is-expanded) .qq-expand-icon {
      transform: rotate(90deg);
    }

    #page-qq-app .qq-group-contacts {
      padding-bottom: 3px;
    }

    #page-qq-app .qq-group-contacts .qq-contact-item {
      padding-left: 30px;
    }

    #page-qq-app .qq-group-contacts .qq-contact-item + .qq-contact-item::before {
      left: 85px;
    }

    #page-qq-app .qq-contact-status-dot {
      width: 7px;
      height: 7px;
      flex: 0 0 7px;
      border-radius: 50%;
      background: #18cf79;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28);
    }

    #page-qq-app .qq-contact-status-dot.is-offline {
      background: #b7bac0;
      box-shadow: none;
    }

    #page-qq-app .qq-friend-headchar {
      min-height: 34px;
      padding: 12px 15px 5px;
      color: #757980;
      background: var(--qq-surface);
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1;
    }

    #page-qq-app .qq-contact-total {
      padding: 14px 16px 26px;
      color: #9a9da3;
      text-align: center;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-profile-view {
      grid-area: 1 / 1;
      justify-self: center;
      width: min(100%, var(--qq-frame-width));
      height: 100%;
      min-height: 0;
      display: none;
      overflow: hidden;
      background: var(--qq-surface);
      color: var(--qq-text);
    }

    #page-qq-app[data-qq-view="profile"] .qq-main-view {
      display: none;
    }

    #page-qq-app[data-qq-view="profile"] .qq-profile-view {
      display: block;
    }

    #page-qq-app .qq-profile-layout {
      height: 100%;
      min-height: 0;
      display: grid;
      grid-template-rows: 58px minmax(0, 1fr) auto;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-profile-topbar {
      position: relative;
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) 42px;
      align-items: center;
      padding: 0 10px;
      border-bottom: 1px solid rgba(0, 0, 0, .018);
      background: var(--qq-surface);
    }

    #page-qq-app .qq-profile-title {
      margin: 0;
      text-align: center;
      font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      line-height: 1;
    }

    #page-qq-app .qq-profile-top-action {
      width: 38px;
      height: 38px;
      padding: 8px;
      border: 0;
      background: transparent;
      color: #111317;
      display: grid;
      place-items: center;
      cursor: pointer;
    }

    #page-qq-app .qq-profile-top-action .qq-lucide-svg {
      width: 23px;
      height: 23px;
      stroke-width: 1.65;
    }

    #page-qq-app .qq-profile-back .qq-lucide-svg {
      transform: rotate(180deg);
    }

    #page-qq-app .qq-profile-scroll {
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
      background: var(--qq-surface);
    }
#page-qq-app .qq-profile-hero {
      min-height: 144px;
      padding: 30px 16px 18px;
      display: grid;
      grid-template-columns: 86px minmax(0, 1fr) auto;
      align-items: center;
      gap: 15px;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-profile-avatar {
      width: 86px;
      height: 86px;
      border-radius: 50%;
      overflow: hidden;
      display: block;
      background: #e1e2e5;
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .04);
    }

    #page-qq-app .qq-profile-avatar img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    #page-qq-app .qq-profile-identity {
      min-width: 0;
    }

    #page-qq-app .qq-profile-name {
      margin: 0;
      overflow: hidden;
      color: #ff6249;
      font-size: calc(19px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 700;
      line-height: 1.2;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-profile-subline {
      margin: 7px 0 0;
      overflow: hidden;
      color: #95989f;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.25;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-profile-like {
      min-width: 48px;
      display: grid;
      justify-items: center;
      gap: 2px;
      color: #15171b;
      align-self: center;
    }

    #page-qq-app .qq-profile-like-icon {
      width: 20px;
      height: 20px;
    }

    #page-qq-app .qq-profile-like-icon .qq-lucide-svg {
      width: 20px;
      height: 20px;
      stroke-width: 1.65;
    }

    #page-qq-app .qq-profile-like strong {
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      line-height: 1;
    }

    #page-qq-app .qq-profile-info-button,
    #page-qq-app .qq-profile-feature-row,
    #page-qq-app .qq-profile-marker-row {
      width: 100%;
      border: 0;
      background: var(--qq-surface);
      color: var(--qq-text);
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-profile-info-button {
      min-height: 45px;
      padding: 0 16px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) 16px;
      align-items: center;
      gap: 10px;
    }

    #page-qq-app .qq-profile-info-line {
      overflow: hidden;
      color: #94979d;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-profile-badges {
      min-height: 44px;
      padding: 3px 16px 11px;
      display: flex;
      align-items: center;
      gap: 7px;
      overflow: hidden;
    }

    #page-qq-app .qq-profile-badge {
      height: 24px;
      padding: 0 9px;
      border-radius: 6px;
      background: #fff0dc;
      color: #9a6328;
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      white-space: nowrap;
    }

    #page-qq-app .qq-profile-badge.is-status {
      background: #e8f8f0;
      color: #169a61;
    }

    #page-qq-app .qq-profile-badge.is-status.is-offline {
      background: #f0f1f2;
      color: #898d94;
    }

    #page-qq-app .qq-profile-badge-icon {
      width: 14px;
      height: 14px;
      color: #ffc129;
    }

    #page-qq-app .qq-profile-tag-wrap {
      padding: 7px 16px 14px;
      border-top: 1px solid var(--qq-line);
    }

    #page-qq-app .qq-profile-tag {
      min-height: 28px;
      max-width: 100%;
      padding: 5px 9px;
      border: 1px solid #e3e4e6;
      border-radius: 8px;
      display: inline-block;
      overflow: hidden;
      color: #34363b;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-profile-marker-row {
      min-height: 58px;
      padding: 0 16px;
      border-top: 1px solid var(--qq-line);
      display: grid;
      grid-template-columns: 26px minmax(0, 1fr) auto 16px;
      align-items: center;
      gap: 10px;
    }

    #page-qq-app .qq-profile-marker-icon,
    #page-qq-app .qq-profile-feature-icon {
      display: grid;
      place-items: center;
      color: #181a1f;
    }

    #page-qq-app .qq-profile-marker-icon {
      width: 20px;
      height: 20px;
    }

    #page-qq-app .qq-profile-marker-icon .qq-lucide-svg,
    #page-qq-app .qq-profile-feature-icon .qq-lucide-svg {
      width: 20px;
      height: 20px;
      stroke-width: 1.65;
    }

    #page-qq-app .qq-profile-marker-copy,
    #page-qq-app .qq-profile-feature-copy {
      min-width: 0;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.2;
    }

    #page-qq-app .qq-profile-marker-note {
      max-width: 170px;
      overflow: hidden;
      color: #a0a2a8;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-profile-divider {
      height: 10px;
      background: var(--qq-soft);
    }

    #page-qq-app .qq-profile-feature-row {
      position: relative;
      min-height: 52px;
      padding: 0 16px;
      display: grid;
      grid-template-columns: 26px minmax(0, 1fr) 16px;
      align-items: center;
      gap: 10px;
    }

    #page-qq-app .qq-profile-feature-row + .qq-profile-feature-row::before {
      content: "";
      position: absolute;
      left: 52px;
      right: 0;
      top: 0;
      height: 1px;
      background: var(--qq-line);
    }

    #page-qq-app .qq-profile-feature-icon {
      width: 20px;
      height: 20px;
    }

    #page-qq-app .qq-profile-chevron {
      width: 16px;
      height: 16px;
      color: #a1a4aa;
    }

    #page-qq-app .qq-profile-actions {
      padding: 10px 15px max(15px, env(safe-area-inset-bottom));
      border-top: 1px solid #f1f1f2;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-profile-action {
      min-height: 45px;
      padding: 0 8px;
      border: 1px solid #dfe0e2;
      border-radius: 13px;
      background: var(--qq-surface);
      color: #111317;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 550;
      cursor: pointer;
      white-space: nowrap;
    }

    #page-qq-app .qq-profile-action.is-primary {
      border-color: var(--qq-blue);
      background: var(--qq-blue);
      color: #fff;
    }

    /* QQ 聊天页：直接按参考图的实际 QQ 比例绘制，不包含系统状态栏。 */
    #page-qq-app .qq-chat-view {
      position: relative;
      grid-area: 1 / 1;
      justify-self: center;
      width: min(100%, var(--qq-frame-width));
      height: 100%;
      min-height: 0;
      display: none;
      overflow: hidden;
      background: #f0f0f2;
      color: var(--qq-text);
    }

    #page-qq-app[data-qq-view="chat"] .qq-main-view,
    #page-qq-app[data-qq-view="chat"] .qq-profile-view,
    #page-qq-app[data-qq-view="chat"] .qq-side-view {
      display: none;
    }

    #page-qq-app[data-qq-view="chat"] .qq-chat-view {
      display: block;
    }

    #page-qq-app .qq-chat-layout {
      height: 100%;
      min-height: 0;
      display: grid;
      grid-template-rows: 68px minmax(0, 1fr) auto;
      overflow: hidden;
      background: #f0f0f2;
    }

    #page-qq-app .qq-chat-topbar {
      min-height: 68px;
      padding: 0 8px;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 2px;
      border-bottom: 1px solid rgba(0, 0, 0, .018);
      background: #f2f2f2;
    }

    #page-qq-app .qq-chat-top-action {
      width: 34px;
      height: 40px;
      padding: 6px;
      border: 0;
      border-radius: 0;
      display: grid;
      place-items: center;
      background: transparent;
      color: #17181a;
      cursor: pointer;
      transition: transform .12s ease;
    }

    #page-qq-app .qq-chat-top-action:active,
    #page-qq-app .qq-chat-tool:active,
    #page-qq-app .qq-chat-send:active {
      transform: scale(.94);
    }

    #page-qq-app .qq-chat-top-action .qq-lucide-svg {
      width: 25px;
      height: 25px;
      stroke-width: 2;
    }

    #page-qq-app .qq-chat-top-menu {
      flex: 0 0 34px;
      margin-left: auto;
      color: #17181a;
    }

    #page-qq-app .qq-chat-top-menu .qq-chat-top-menu-icon {
      width: 21px;
      height: 21px;
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-chat-top-menu .qq-chat-top-menu-icon svg {
      width: 21px;
      height: 21px;
      display: block;
      color: currentColor;
    }

    #page-qq-app .qq-chat-select-title {
      display:none;
      flex:1;
      text-align:center;
      color:#17181a;
      font-size:16px;
      font-weight:600;
    }
    #page-qq-app .qq-chat-search { margin-left:auto; }
    #page-qq-app .qq-chat-view.is-selecting .qq-chat-title,
    #page-qq-app .qq-chat-view.is-selecting .qq-chat-top-menu { display:none; }
    #page-qq-app .qq-chat-view.is-selecting .qq-chat-select-title { display:block; }

    #page-qq-app .qq-chat-title {
      min-width: 0;
      max-width: none;
      flex: 1 1 auto;
      margin: 0 0 0 1px;
      padding: 0;
      border: 0;
      overflow: hidden;
      background: transparent;
      color: #17181a;
      font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
      gap: 6px;
      line-height: 1;
      text-align: left;
      white-space: nowrap;
      text-overflow: ellipsis;
      cursor: pointer;
    }

    #page-qq-app .qq-chat-title-name {
      display: block;
      max-width: 100%;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-chat-presence {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      color: #8b8e94;
      font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 400;
      line-height: 1;
    }

    #page-qq-app .qq-chat-presence-dot {
      width: 7px;
      height: 7px;
      flex: 0 0 7px;
      border-radius: 50%;
      background: #28c76f;
      box-shadow: 0 0 0 2px rgba(40, 199, 111, .12);
    }

    #page-qq-app .qq-chat-stream {
      min-height: 0;
      padding: 17px 14px 20px;
      overflow-y: auto;
      overscroll-behavior: contain;
      background: #f0f0f2;
      scroll-padding-bottom: 22px;
    }
#page-qq-app .qq-chat-system-row {
      width: 100%;
      margin: 12px 0;
      display: flex;
      justify-content: center;
    }

    #page-qq-app .qq-chat-system-notice {
      max-width: min(78%, 300px);
      min-height: 22px;
      padding: 4px 9px;
      border: 0;
      border-radius: 6px;
      background: rgba(105, 108, 114, .22);
      color: #000000;
      font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 400;
      line-height: 1.35;
      text-align: center;
      overflow-wrap: anywhere;
    }

    #page-qq-app button.qq-chat-system-notice {
      cursor: pointer;
    }

    #page-qq-app .qq-chat-message {
      width: 100%;
      margin: 0 0 13px;
      position: relative;
      display: grid;
      align-items: start;
      column-gap: 6px;
    }

    #page-qq-app .qq-chat-message.is-incoming {
      grid-template-columns: var(--qq-chat-avatar-size) minmax(0, 1fr) var(--qq-chat-avatar-size);
      grid-template-areas: "avatar bubble .";
    }

    #page-qq-app .qq-chat-message.is-outgoing {
      grid-template-columns: var(--qq-chat-avatar-size) minmax(0, 1fr) var(--qq-chat-avatar-size);
      grid-template-areas: ". bubble avatar";
    }

    #page-qq-app .qq-chat-message.is-incoming.has-thinking {
      grid-template-areas:
        "thinking thinking ."
        "avatar bubble .";
      row-gap: 4px;
    }

    #page-qq-app .qq-chat-quote {
      width: 100%;
      margin: 0 0 7px;
      padding: 7px 9px;
      border: 0;
      border-left: 3px solid rgba(72, 76, 83, .42);
      border-radius: 7px;
      display: block;
      background: rgba(80, 84, 91, .1);
      color: inherit;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-chat-quote-sender {
      display: block;
      margin-bottom: 3px;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      opacity: .72;
    }

    #page-qq-app .qq-chat-quote-text {
      display: -webkit-box;
      overflow: hidden;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
      opacity: .72;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
    }

    #page-qq-app .qq-chat-message.is-quote-highlight .qq-chat-message-content {
      animation: qqQuoteHighlight 1.15s ease;
    }

    @keyframes qqQuoteHighlight {
      0%, 100% { box-shadow: none; }
      35% { box-shadow: 0 0 0 4px rgba(0, 153, 255, .25); }
    }

    #page-qq-app .qq-chat-forward-bundle {
      min-width: 206px;
      max-width: 270px;
      padding: 11px 12px;
      border: 0;
      border-radius: 12px;
      background: #ffffff;
      color: #17181b;
      text-align: left;
    }

    #page-qq-app .qq-chat-forward-head {
      display: block;
      margin-bottom: 6px;
      color: #7f8288;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-chat-forward-preview {
      display: grid;
      gap: 4px;
      color: #666970;
      font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
    }

    #page-qq-app .qq-chat-forward-foot {
      display: block;
      margin-top: 9px;
      padding-top: 7px;
      border-top: 1px solid #ededee;
      color: #96999f;
      font-size: calc(9.5px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-chat-forward-detail-page {
      position: absolute;
      inset: 0;
      z-index: 26;
      display: none;
      grid-template-rows: 58px minmax(0, 1fr);
      background: #f1f2f4;
      color: #17191d;
    }

    #page-qq-app .qq-chat-forward-detail-page.is-open { display: grid; }
    #page-qq-app .qq-chat-forward-detail-header { padding: 0 10px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 38px; align-items: center; background: #fff; border-bottom: 1px solid #e8e8ea; }
    #page-qq-app .qq-chat-forward-detail-back { width: 38px; height: 38px; padding: 7px; border: 0; background: transparent; }
    #page-qq-app .qq-chat-forward-detail-title { margin: 0; overflow: hidden; text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-chat-forward-detail-list { min-height: 0; padding: 14px 12px 28px; overflow-y: auto; background: #f0f0f2; }
#page-qq-app .qq-chat-forward-detail-message .qq-chat-avatar { box-shadow: 0 0 0 1px rgba(0,0,0,.04); }
    #page-qq-app .qq-chat-message.qq-chat-forward-detail-message.is-incoming,
    #page-qq-app .qq-chat-message.qq-chat-forward-detail-message.is-incoming.has-thinking {
      grid-template-areas:
        "avatar name ."
        "avatar bubble ."
        ". thinking .";
      row-gap: 4px;
    }
    #page-qq-app .qq-chat-message.qq-chat-forward-detail-message.is-outgoing {
      grid-template-areas:
        ". name avatar"
        ". bubble avatar";
      row-gap: 4px;
    }
    #page-qq-app .qq-chat-forward-detail-sender-name { grid-area: name; min-width: 0; overflow: hidden; color: rgba(55,58,64,.62); font-size: calc(9.5px * var(--user-font-size-scale) * var(--display-scale)); line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
    #page-qq-app .qq-chat-forward-detail-message.is-incoming .qq-chat-forward-detail-sender-name { justify-self: start; }
    #page-qq-app .qq-chat-forward-detail-message.is-outgoing .qq-chat-forward-detail-sender-name { justify-self: end; text-align: right; }
    #page-qq-app .qq-chat-forward-detail-message .qq-chat-thinking { margin-left: 0; }

    #page-qq-app .qq-chat-thinking {
      grid-area: thinking;
      min-width: 0;
      width: max-content;
      max-width: none;
      margin-left: calc(var(--qq-chat-avatar-size) + 6px);
      justify-self: start;
      overflow: visible;
      border: 0;
      border-radius: 0;
      background: transparent;
      color: #5e626b;
    }

    /* 折叠态只占微型 Thinking 头部本身；正文宽度仅在展开后启用。 */
    #page-qq-app .qq-chat-thinking.is-expanded {
      width: min(58vw, 220px);
      max-width: min(58vw, 220px);
    }

    /* Thinking 保持自身紧凑排版；QQ 控件的基础 font 继承已通过 :where() 降为低权重，
       具体组件字号由各自组件规则稳定接管。 */
    #page-qq-app button.qq-chat-thinking-toggle {
      width: max-content;
      min-width: max-content;
      max-width: none;
      height: 16px;
      min-height: 16px;
      max-height: 16px;
      padding: 0 3px;
      box-sizing: border-box;
      overflow: hidden;
      border: .75px solid #e4e5e8;
      border-radius: 5px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 1px;
      background: #ffffff;
      color: #686c74;
      font-family: var(--user-font-family);
      font-size: 8px;
      font-weight: 500;
      font-style: normal;
      font-variant: normal;
      line-height: 1;
      letter-spacing: 0;
      text-transform: none;
      cursor: pointer;
      white-space: nowrap;
    }

    #page-qq-app button.qq-chat-thinking-toggle .qq-lucide-svg {
      width: 6px;
      height: 6px;
      flex: 0 0 6px;
      stroke-width: 1.5;
      color: #8e9198;
      transition: transform .18s ease;
    }

    #page-qq-app .qq-chat-thinking.is-expanded .qq-chat-thinking-toggle .qq-lucide-svg {
      transform: rotate(180deg);
    }

    #page-qq-app .qq-chat-thinking-result {
      width: 100%;
      max-height: min(22vh, 150px);
      margin: 4px 0 0;
      padding: 6px 8px 8px;
      overflow: auto;
      border: 1px solid #e4e5e8;
      border-radius: 9px;
      background: #ffffff;
      color: #666a72;
      font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 400;
      line-height: 1.42;
      overflow-wrap: anywhere;
      white-space: pre-wrap;
    }
#page-qq-app .qq-chat-thinking-result[hidden] {
      display: none;
    }

    #page-qq-app .qq-chat-avatar {
      grid-area: avatar;
      width: var(--qq-chat-avatar-size);
      height: var(--qq-chat-avatar-size);
      flex: 0 0 var(--qq-chat-avatar-size);
      border-radius: 50%;
      overflow: hidden;
      background: #d8dadd;
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
      box-shadow: none;
    }

    #page-qq-app .qq-chat-avatar img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    #page-qq-app .qq-chat-bubble {
      grid-area: bubble;
      position: relative;
      z-index: 1;
      width: fit-content;
      max-width: min(72vw, 280px);
      min-height: var(--qq-chat-bubble-min-height);
      padding: calc(6px * var(--display-scale)) calc(10px * var(--display-scale));
      border-radius: calc(14px * var(--display-scale));
      display: grid;
      align-content: center;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 400;
      line-height: 1.34;
      letter-spacing: 0;
      overflow: visible;
      overflow-wrap: anywhere;
      white-space: pre-wrap;
      box-shadow: none;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      user-select: none;
    }

    #page-qq-app .qq-chat-message.is-incoming .qq-chat-bubble {
      justify-self: start;
      background: #ffffff;
      color: #17181b;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-bubble {
      justify-self: end;
      background: #0099ff;
      color: #ffffff;
    }

    #page-qq-app .qq-chat-translation-original,
    #page-qq-app .qq-chat-translation-text {
      display: block;
      min-width: 0;
      overflow-wrap: anywhere;
      white-space: pre-wrap;
    }

    #page-qq-app .qq-chat-translation-text {
      margin-top: calc(5px * var(--display-scale));
      padding-top: calc(5px * var(--display-scale));
      border-top: 1px solid rgba(23, 24, 27, .13);
      opacity: .72;
      font-size: .92em;
      line-height: 1.4;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-translation-text {
      border-top-color: rgba(255, 255, 255, .28);
      opacity: .82;
    }

    /* QWQ 聊天气泡小尾巴：左右形状沿用参考样式，选择器完全收敛到 QWQ 现有结构 */
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-bubble::after {
      content: "";
      position: absolute;
      width: 12px;
      height: 15px;
      right: 6px;
      bottom: -15px;
      box-sizing: border-box;
      background-color: inherit;
      clip-path: path("M 15,13 Q 12,0 2,2 Q 7,3 5,22 L 13,12");
      transform: rotate(-2deg) scale(-1);
      transform-origin: top right;
      pointer-events: none;
      z-index: 1;
    }

    #page-qq-app .qq-chat-message.is-incoming .qq-chat-bubble::before {
      content: "";
      position: absolute;
      width: 12px;
      height: 15px;
      left: -7px;
      bottom: -15px;
      box-sizing: border-box;
      background-color: inherit;
      clip-path: path("M 11,16 Q 10,0 1,1 Q 6.6,3 1,19 L 19,16");
      transform: rotate(19deg) scaleY(-1);
      transform-origin: top left;
      pointer-events: none;
      z-index: 1;
    }

    #page-qq-app .qq-chat-message.is-menu-target .qq-chat-message-content {
      box-shadow: inset 0 0 0 1px rgba(90, 90, 90, .08);
    }

    #page-qq-app .qq-chat-message.is-outgoing.is-menu-target .qq-chat-message-content {
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
    }

    #page-qq-app .qq-chat-message-content.is-text-selecting {
      -webkit-user-select: text;
      user-select: text;
    }

    #page-qq-app .qq-chat-voice-transcript.is-text-selecting {
      -webkit-user-select: text;
      user-select: text;
    }

    /* 线下正文的段落语义只在此定义；页面结构与杂志式卡片统一由线下页专属规则接管。 */
    #page-qq-app .qq-chat-offline-original,
    #page-qq-app .qq-chat-offline-translation {
      min-width: 0;
      display: grid;
      gap: 10px;
    }

    #page-qq-app .qq-chat-offline-translation {
      margin-top: 12px;
      padding-top: 12px;
      border-top: 1px solid rgba(23, 24, 27, .11);
    }

    #page-qq-app .qq-chat-offline-dialogue,
    #page-qq-app .qq-chat-offline-narration {
      margin: 0;
      min-width: 0;
      white-space: pre-wrap;
    }

    #page-qq-app .qq-chat-offline-dialogue {
      color: #17181b;
      font-style: normal;
      font-weight: 500;
    }

    #page-qq-app .qq-chat-offline-narration {
      color: rgba(37, 39, 44, .58);
      font-style: italic;
      font-weight: 400;
    }

    #page-qq-app .qq-chat-bubble.is-voice-message {
      min-width: 108px;
      padding: 7px 9px;
      cursor: pointer;
      white-space: normal;
    }

    #page-qq-app .qq-chat-voice {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 7px;
    }

    #page-qq-app .qq-chat-voice-main {
      min-height: 20px;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    #page-qq-app .qq-chat-voice-waveform {
      height: 20px;
      flex: 1 1 auto;
      display: flex;
      align-items: center;
      gap: 3px;
      color: inherit;
    }

    #page-qq-app .qq-chat-voice-bar {
      width: 3px;
      height: var(--qq-voice-bar-height, 10px);
      border-radius: 999px;
      background: currentColor;
      opacity: .82;
      transform-origin: center;
    }

    #page-qq-app .qq-chat-voice-bar:nth-child(1) { --qq-voice-bar-height: 7px; }
    #page-qq-app .qq-chat-voice-bar:nth-child(2) { --qq-voice-bar-height: 14px; }
    #page-qq-app .qq-chat-voice-bar:nth-child(3) { --qq-voice-bar-height: 19px; }
    #page-qq-app .qq-chat-voice-bar:nth-child(4) { --qq-voice-bar-height: 12px; }
    #page-qq-app .qq-chat-voice-bar:nth-child(5) { --qq-voice-bar-height: 8px; }

    #page-qq-app .qq-chat-bubble.is-voice-playing .qq-chat-voice-bar {
      animation: qq-chat-voice-wave 1s ease-in-out infinite;
    }

    #page-qq-app .qq-chat-bubble.is-voice-playing .qq-chat-voice-bar:nth-child(1) { animation-delay: 0s; }
    #page-qq-app .qq-chat-bubble.is-voice-playing .qq-chat-voice-bar:nth-child(2) { animation-delay: .12s; }
    #page-qq-app .qq-chat-bubble.is-voice-playing .qq-chat-voice-bar:nth-child(3) { animation-delay: .24s; }
    #page-qq-app .qq-chat-bubble.is-voice-playing .qq-chat-voice-bar:nth-child(4) { animation-delay: .36s; }
    #page-qq-app .qq-chat-bubble.is-voice-playing .qq-chat-voice-bar:nth-child(5) { animation-delay: .48s; }

    #page-qq-app .qq-chat-voice-duration {
      flex: 0 0 auto;
      min-width: 28px;
      font-size: .78em;
      line-height: 1;
      text-align: right;
      opacity: .76;
    }

    #page-qq-app .qq-chat-voice-transcript {
      padding-top: 7px;
      border-top: 1px solid rgba(23, 24, 27, .12);
      font-size: .9em;
      line-height: 1.42;
      overflow-wrap: anywhere;
      white-space: pre-wrap;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-voice-transcript {
      border-top-color: rgba(255, 255, 255, .26);
    }

    #page-qq-app .qq-chat-voice-transcript[hidden] {
      display: none;
    }

    @keyframes qq-chat-voice-wave {
      0%, 100% { transform: scaleY(.58); opacity: .58; }
      50% { transform: scaleY(1.08); opacity: 1; }
    }

    /* 图片、文字图与位置是独立消息内容，不创建聊天气泡外壳。 */
    #page-qq-app .qq-chat-rich-content {
      grid-area: bubble;
      position: relative;
      z-index: 1;
      width: fit-content;
      max-width: min(72vw, 286px);
      min-height: 0;
      padding: 0;
      background: transparent;
      color: #17181b;
      box-shadow: none;
      white-space: normal;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      user-select: none;
    }

    #page-qq-app .qq-chat-message.is-incoming .qq-chat-rich-content {
      justify-self: start;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-rich-content {
      justify-self: end;
    }

    #page-qq-app .qq-chat-photo-card {
      position: relative;
      width: fit-content;
      max-width: min(66vw, 286px);
      overflow: hidden;
      border-radius: 13px;
      background: #e8e8ea;
      box-shadow: 0 4px 14px rgba(20, 23, 30, .11);
      cursor: pointer;
    }

    #page-qq-app .qq-chat-photo-card img {
      display: block;
      width: auto;
      height: auto;
      max-width: min(66vw, 286px);
      max-height: min(52vh, 350px);
      object-fit: contain;
      background: #ededee;
    }

    #page-qq-app .qq-chat-photo-caption {
      position: absolute;
      left: 9px;
      bottom: 8px;
      max-width: calc(100% - 18px);
      padding: 4px 8px;
      border-radius: 999px;
      background: rgba(20, 20, 22, .54);
      color: #fff;
      font-size: 10px;
      line-height: 1.2;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
    }

    #page-qq-app .qq-chat-polaroid {
      position: relative;
      width: min(57vw, 208px);
      aspect-ratio: 1 / 1;
      padding: 0;
      overflow: hidden;
      border-radius: 16px;
      background: #f1f1f2;
      box-shadow: 0 6px 18px rgba(22, 24, 30, .12);
      cursor: pointer;
      box-sizing: border-box;
      transform: translateZ(0);
      transition: transform .2s ease, box-shadow .25s ease;
    }

    #page-qq-app .qq-chat-polaroid:active {
      transform: scale(.985);
    }

    #page-qq-app .qq-chat-polaroid.is-revealed {
      box-shadow: 0 10px 26px rgba(22, 24, 30, .16);
    }

    #page-qq-app .qq-chat-polaroid-cover {
      display: block;
      width: 100%;
      height: 100%;
      border-radius: inherit;
      object-fit: cover;
      background: #f1f1f2;
    }

    #page-qq-app .qq-chat-polaroid-overlay {
      position: absolute;
      inset: 0;
      z-index: 3;
      padding: 18px 17px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
      overflow: auto;
      border-radius: inherit;
      background: rgba(255, 255, 255, .93);
      color: #2c2d31;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.62;
      text-align: left;
      white-space: pre-wrap;
      overflow-wrap: anywhere;
      opacity: 0;
      visibility: hidden;
      transform: scale(.985);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      transition: opacity .22s ease, transform .22s ease, visibility 0s linear .22s;
      box-sizing: border-box;
    }

    #page-qq-app .qq-chat-polaroid.is-revealed .qq-chat-polaroid-overlay {
      opacity: 1;
      visibility: visible;
      transform: scale(1);
      transition: opacity .22s ease, transform .22s ease, visibility 0s linear 0s;
    }

    #page-qq-app .qq-chat-location-card {
      width: min(68vw, 230px);
      overflow: hidden;
      border: 1px solid rgba(24, 27, 31, .08);
      border-radius: 10px;
      background: #ffffff;
      box-shadow: 0 2px 8px rgba(32, 35, 40, .10);
      cursor: default;
    }

    #page-qq-app .qq-chat-location-header {
      min-width: 0;
      padding: 10px 11px;
      border-bottom: 1px solid rgba(30, 34, 40, .07);
      display: grid;
      grid-template-columns: 17px minmax(0, 1fr);
      align-items: center;
      gap: 8px;
      background: #ffffff;
    }

    #page-qq-app .qq-chat-location-icon {
      width: 17px;
      height: 17px;
      display: grid;
      place-items: center;
      color: #17181b;
    }

    #page-qq-app .qq-chat-location-icon .qq-lucide-svg {
      width: 16px;
      height: 16px;
      stroke-width: 1.8;
    }

    #page-qq-app .qq-chat-location-copy {
      min-width: 0;
      display: block;
    }

    #page-qq-app .qq-chat-location-name {
      display: block;
      color: #17181b;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      line-height: 1.25;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #page-qq-app .qq-chat-location-address {
      display: block;
      margin-top: 2px;
      color: #8a8d94;
      font-size: calc(9px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.3;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #page-qq-app .qq-chat-location-map {
      position: relative;
      height: 108px;
      overflow: hidden;
      isolation: isolate;
      background:
        radial-gradient(circle at 18% 18%, rgba(255,255,255,.9) 0 3%, transparent 3.5%),
        linear-gradient(145deg, #e7eee9 0%, #edf1ed 52%, #e2ebe7 100%);
    }

    #page-qq-app .qq-chat-map-block,
    #page-qq-app .qq-chat-map-park,
    #page-qq-app .qq-chat-map-road,
    #page-qq-app .qq-chat-map-label {
      position: absolute;
    }

    #page-qq-app .qq-chat-map-block {
      z-index: 1;
      border: 1px solid rgba(120, 135, 130, .12);
      border-radius: 3px;
      background: rgba(241, 237, 224, .92);
      transform: rotate(var(--map-rotate, 0deg));
    }

    #page-qq-app .qq-chat-map-park {
      z-index: 1;
      border: 1px solid rgba(95, 145, 107, .14);
      border-radius: 42% 58% 52% 48%;
      background: rgba(178, 214, 177, .76);
      transform: rotate(var(--map-rotate, 0deg));
    }

    #page-qq-app .qq-chat-map-road {
      z-index: 3;
      left: var(--map-left, 0%);
      top: var(--map-top, 0%);
      width: var(--map-width, 80%);
      height: var(--map-road-size, 5px);
      border-radius: 999px;
      background: rgba(255, 255, 255, .96);
      box-shadow: 0 0 0 1px rgba(154, 167, 163, .22), 0 1px 2px rgba(60, 70, 68, .08);
      transform: rotate(var(--map-angle, 0deg));
      transform-origin: left center;
    }

    #page-qq-app .qq-chat-map-road.is-main {
      --map-road-size: 8px;
      box-shadow: 0 0 0 1px rgba(148, 160, 156, .24), inset 0 0 0 2px rgba(244, 220, 151, .38);
    }

    #page-qq-app .qq-chat-map-water {
      position: absolute;
      inset: 0;
      z-index: 2;
      width: 100%;
      height: 100%;
      pointer-events: none;
    }

    #page-qq-app .qq-chat-map-water path {
      fill: none;
      stroke: rgba(153, 205, 222, .68);
      stroke-width: 13;
      stroke-linecap: round;
      filter: drop-shadow(0 0 1px rgba(92, 154, 175, .22));
    }

    #page-qq-app .qq-chat-map-label {
      z-index: 4;
      padding: 1px 3px;
      border-radius: 3px;
      background: rgba(255, 255, 255, .54);
      color: rgba(70, 82, 79, .7);
      font-size: 8px;
      line-height: 1.15;
      white-space: nowrap;
      pointer-events: none;
    }

    #page-qq-app .qq-chat-map-pin {
      position: absolute;
      left: 50%;
      top: 52%;
      z-index: 8;
      width: 25px;
      height: 25px;
      border: 3px solid #fff;
      border-radius: 50% 50% 50% 10%;
      background: #f24a55;
      box-shadow: 0 4px 9px rgba(124, 35, 44, .3);
      transform: translate(-50%, -88%) rotate(-45deg);
    }

    #page-qq-app .qq-chat-map-pin::after {
      content: "";
      position: absolute;
      left: 50%;
      top: 50%;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #fff;
      transform: translate(-50%, -50%);
    }

    #page-qq-app .qq-chat-map-pin-shadow {
      position: absolute;
      left: 50%;
      top: 53%;
      z-index: 7;
      width: 26px;
      height: 8px;
      border-radius: 50%;
      background: rgba(55, 65, 63, .18);
      filter: blur(2px);
      transform: translate(-50%, -50%);
    }

    #page-qq-app .qq-image-viewer-page {
      position: absolute;
      inset: 0;
      z-index: var(--layer-modal-overlay);
      display: none;
      overflow: hidden;
      background: #050506;
      color: #fff;
    }

    #page-qq-app .qq-image-viewer-page.is-open {
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-image-viewer-image {
      display: block;
      width: auto;
      height: auto;
      max-width: 100%;
      max-height: 100%;
      object-fit: contain;
    }

    #page-qq-app .qq-image-viewer-close {
      position: absolute;
      top: max(16px, env(safe-area-inset-top));
      right: 16px;
      z-index: 2;
      width: 38px;
      height: 38px;
      padding: 0;
      border: 1px solid rgba(255, 255, 255, .24);
      border-radius: 50%;
      background: rgba(28, 28, 30, .72);
      color: #fff;
      display: grid;
      place-items: center;
      cursor: pointer;
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    #page-qq-app .qq-image-viewer-close .qq-lucide-svg {
      width: 20px;
      height: 20px;
      display: block;
      stroke-width: 2;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-polaroid {
      background: #2c2c2e;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-polaroid-overlay {
      background: rgba(36, 37, 40, .93);
      color: #f4f4f5;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-location-card,
    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-location-header {
      background: #2c2c2e;
      border-color: rgba(255, 255, 255, .1);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-location-name,
    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-location-icon {
      color: #f5f5f7;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-location-map {
      filter: brightness(.76) saturate(.82);
    }

    /* QWQ 消息编辑面板：QQ 式深灰浮层，5 列 × 2 行。 */
    #page-qq-app .qq-chat-edit-menu {
      --qq-chat-edit-arrow-x: 50%;
      position: absolute;
      z-index: 18;
      width: min(calc(100% - 44px), 292px);
      min-width: 0;
      padding: 9px 8px;
      border: 0;
      border-radius: 5px;
      background: rgba(83, 83, 83, .97);
      color: #ffffff;
      box-shadow: 0 7px 20px rgba(0, 0, 0, .22);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(4px) scale(.985);
      transform-origin: center;
      transition: opacity .13s ease, transform .13s ease, visibility 0s linear .13s;
    }

    #page-qq-app .qq-chat-edit-menu.is-open {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0) scale(1);
      transition-delay: 0s;
    }

    #page-qq-app .qq-chat-edit-menu::before {
      content: "";
      position: absolute;
      left: var(--qq-chat-edit-arrow-x);
      width: 0;
      height: 0;
      transform: translateX(-50%);
      pointer-events: none;
    }

    #page-qq-app .qq-chat-edit-menu[data-placement="above"]::before {
      top: 100%;
      border-top: 9px solid rgba(83, 83, 83, .97);
      border-right: 8px solid transparent;
      border-left: 8px solid transparent;
    }

    #page-qq-app .qq-chat-edit-menu[data-placement="below"]::before {
      bottom: 100%;
      border-right: 8px solid transparent;
      border-bottom: 9px solid rgba(83, 83, 83, .97);
      border-left: 8px solid transparent;
    }

    #page-qq-app .qq-chat-edit-grid {
      position: relative;
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      grid-template-rows: repeat(2, 58px);
    }

    #page-qq-app .qq-chat-edit-grid::after {
      content: "";
      position: absolute;
      top: 58px;
      right: 8px;
      left: 8px;
      height: 1px;
      background: rgba(255, 255, 255, .075);
      pointer-events: none;
    }

    #page-qq-app .qq-chat-edit-item {
      min-width: 0;
      min-height: 58px;
      padding: 5px 2px 4px;
      border: 0;
      outline: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
      background: transparent;
      color: #ffffff;
      font-family: var(--user-font-family);
      font-size: calc(11.5px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 500;
      line-height: 1;
      white-space: nowrap;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
    }

    #page-qq-app .qq-chat-edit-item:active {
      background: rgba(255, 255, 255, .08);
    }

    #page-qq-app .qq-chat-edit-item[hidden] { display: none; }
    #page-qq-app .qq-chat-edit-item:disabled { opacity: .36; pointer-events: none; }

    #page-qq-app .qq-chat-edit-icon {
      width: 22px;
      height: 22px;
      display: grid;
      place-items: center;
      color: #ffffff;
    }

    #page-qq-app .qq-chat-edit-icon svg {
      width: 21px;
      height: 21px;
      display: block;
      color: #ffffff;
      fill: currentColor;
    }

    #page-qq-app .qq-chat-edit-item[data-chat-edit-action="edit"] .qq-chat-edit-icon svg,
    #page-qq-app .qq-chat-edit-item[data-chat-edit-action="translate"] .qq-chat-edit-icon svg {
      width: 20px;
      height: 20px;
    }

    @media (max-width: 360px) {
      #page-qq-app .qq-chat-edit-menu {
        width: calc(100% - 22px);
        min-width: 0;
        padding-inline: 6px;
      }
      #page-qq-app .qq-chat-edit-item {
        font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
      }
    }

    /* 消息多选模式：仿 Jingxu 选中按钮 + 底部操作栏 */
    #page-qq-app .qq-chat-select-check {
      position: absolute;
      left: 10px;
      top: 50%;
      width: 24px;
      height: 24px;
      margin-top: -12px;
      border-radius: 50%;
      background: #D9DCE1;
      display: none;
      place-items: center;
      color: #FFFFFF;
      z-index: 3;
    }

    #page-qq-app .qq-chat-select-check::before {
      content: "";
      width: 10px;
      height: 6px;
      border-left: 2px solid #FFFFFF;
      border-bottom: 2px solid #FFFFFF;
      transform: translateY(-2px) rotate(-45deg);
      opacity: 0;
    }

    #page-qq-app .qq-chat-message.is-multi-selected .qq-chat-select-check,
    #page-qq-app .qq-chat-system-row.is-multi-selected .qq-chat-select-check {
      display: grid;
      background: #0099FF;
    }

    #page-qq-app .qq-chat-view.is-selecting .qq-chat-message,
    #page-qq-app .qq-chat-view.is-selecting .qq-chat-system-row.is-selectable-system {
      padding-left: 42px;
      cursor: pointer;
    }

    #page-qq-app .qq-chat-view.is-selecting .qq-chat-select-check {
      display: grid;
    }

    #page-qq-app .qq-chat-message.is-multi-selected .qq-chat-select-check::before,
    #page-qq-app .qq-chat-system-row.is-multi-selected .qq-chat-select-check::before {
      opacity: 1;
    }

    #page-qq-app .qq-chat-system-row.is-selectable-system { position: relative; min-height: 32px; align-items: center; }
    #page-qq-app .qq-chat-system-row.is-range-anchor { outline: 2px solid rgba(0, 153, 255, .24); outline-offset: -2px; border-radius: 12px; }
    #page-qq-app .qq-chat-message.is-range-anchor .qq-chat-message-content { box-shadow: 0 0 0 3px rgba(0, 153, 255, .22); }

    #page-qq-app .qq-chat-select-cancel {
      display:none;
      border:0;
      background:transparent;
      color:#0099FF;
      font-size:16px;
      font-weight:500;
      padding:0;
    }

    #page-qq-app .qq-chat-view.is-selecting .qq-chat-select-cancel {
      display:block;
    }

    #page-qq-app .qq-chat-view.is-selecting [data-qq-chat-back],
    #page-qq-app .qq-chat-view.is-selecting .qq-chat-title,
    #page-qq-app .qq-chat-view.is-selecting .qq-chat-top-menu {
      display:none;
    }

    #page-qq-app .qq-chat-selection-bar {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      height: 64px;
      padding: 0 14px;
      display: none;
      grid-template-columns: repeat(5, 1fr);
      align-items: center;
      justify-items: center;
      background: #FFFFFF;
      border-top: 1px solid #E5E5EA;
      z-index: 12;
    }

    #page-qq-app .qq-chat-view.is-selecting .qq-chat-selection-bar {
      display: grid;
    }

    #page-qq-app .qq-chat-selection-action {
      width: 40px;
      height: 40px;
      padding: 0;
      border: 0;
      outline: 0;
      background: transparent;
      color: #111111;
      display: grid;
      place-items: center;
      -webkit-tap-highlight-color: transparent;
    }

    #page-qq-app .qq-chat-selection-action:disabled {
      color: #b8bbc0;
      cursor: default;
    }

    #page-qq-app .qq-chat-selection-action.is-active {
      color: #0099ff;
      background: #eaf7ff;
      border-radius: 12px;
    }

    #page-qq-app .qq-chat-selection-action .qq-lucide-svg {
      width: 25px;
      height: 25px;
      display: block;
      fill: none;
      stroke: currentColor;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }

    #page-qq-app .qq-chat-composer {
      padding: 7px 15px max(8px, env(safe-area-inset-bottom));
      border-top: 1px solid #ededee;
      display: grid;
      gap: 8px;
      background: #f5f5f5;
    }

    #page-qq-app .qq-chat-context {
      min-height: 39px;
      padding: 7px 9px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      gap: 9px;
      background: rgba(255, 255, 255, .82);
      color: #6d7076;
    }

    #page-qq-app .qq-chat-context[hidden] { display: none; }
    #page-qq-app .qq-chat-context-copy { min-width: 0; flex: 1; display: grid; gap: 2px; }
    #page-qq-app .qq-chat-context-copy strong { color: #303237; font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-chat-context-copy span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-chat-context-close { width: 27px; height: 27px; padding: 6px; border: 0; border-radius: 50%; background: transparent; color: #8e9197; }

    #page-qq-app .qq-chat-input-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 70px;
      align-items: end;
      gap: 9px;
    }

    #page-qq-app .qq-chat-input {
      width: 100%;
      min-width: 0;
      min-height: 42px;
      max-height: 126px;
      height: 42px;
      padding: 11px 13px 10px;
      border: 0;
      border-radius: 12px;
      outline: 0;
      background: #ffffff;
      color: #17181b;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.45;
      box-shadow: none;
      resize: none;
      overflow-y: hidden;
    }

    #page-qq-app .qq-chat-input::placeholder {
      color: #b8bac0;
    }

    #page-qq-app .qq-chat-send,
    #page-qq-app .qq-chat-send.is-ready,
    #page-qq-app .qq-chat-send:disabled {
      height: 42px;
      padding: 0 12px;
      border: 0;
      border-radius: 12px;
      background: #0099ff;
      color: #ffffff;
      opacity: 1;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      cursor: pointer;
      transition: transform .12s ease, background-color .12s ease, color .12s ease;
    }

    /* 聊天转发只提供 GlobalDrawer 内部业务内容，不再创建 overlay / drawer / handle / title 平行壳。 */
    #theme-global-drawer .qq-chat-forward-body { min-height: 0; display: grid; }
    #theme-global-drawer .qq-chat-forward-mode { width: 100%; min-height: 58px; padding: 0 4px; border: 0; border-bottom: 1px solid var(--ui-line); display: grid; grid-template-columns: 38px minmax(0, 1fr) 18px; align-items: center; gap: 10px; background: transparent; color: var(--ui-text); text-align: left; }
    #theme-global-drawer .qq-chat-forward-mode:last-child { border-bottom: 0; }
    #theme-global-drawer .qq-chat-forward-mode-icon { width: 34px; height: 34px; padding: 8px; border-radius: 10px; display: grid; place-items: center; background: var(--ui-surface-secondary); color: var(--ui-text); }
    #theme-global-drawer .qq-chat-forward-mode-icon svg { width: 18px; height: 18px; fill: currentColor; }
    #theme-global-drawer .qq-chat-forward-mode-copy { display: grid; gap: 3px; }
    #theme-global-drawer .qq-chat-forward-mode-copy strong { font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale)); }
    #theme-global-drawer .qq-chat-forward-mode-copy span { color: var(--ui-muted); font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale)); }
    #theme-global-drawer .qq-chat-forward-contact { min-height: 58px; padding: 0 3px; border-bottom: 1px solid var(--ui-line); display: grid; grid-template-columns: 38px minmax(0, 1fr) 24px; align-items: center; gap: 10px; }
    #theme-global-drawer .qq-chat-forward-avatar { width: 38px; height: 38px; border-radius: 50%; background: var(--ui-surface-secondary) center / cover no-repeat; }
    #theme-global-drawer .qq-chat-forward-contact-name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale)); }
    #theme-global-drawer .qq-chat-forward-check { width: 22px; height: 22px; accent-color: var(--theme-color); }
    #theme-global-drawer .qq-chat-forward-actions { position: sticky; bottom: 0; margin-top: 10px; padding-top: 10px; display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--global-modal-actions-gap); background: var(--ui-panel); }
    #theme-global-drawer .qq-chat-forward-action { height: var(--global-control-height); border: 0; border-radius: var(--global-modal-control-radius); background: var(--ui-surface-secondary); color: var(--ui-text); }
    #theme-global-drawer .qq-chat-forward-action.is-primary { background: var(--global-emphasis-shell-bg); color: var(--global-emphasis-shell-fg); }
    #theme-global-drawer .qq-chat-forward-action:disabled { opacity: .35; }

    #page-qq-app .qq-chat-snapshot-stage {
      position: fixed;
      left: -200vw;
      top: 0;
      width: min(100%, var(--qq-frame-width));
      background: #f0f0f2;
      pointer-events: none;
    }

    #page-qq-app .qq-chat-send.is-ready {
      background: #0099ff;
      color: #ffffff;
      cursor: pointer;
    }

    #page-qq-app .qq-chat-tools {
      min-height: 34px;
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      align-items: center;
      justify-items: center;
      gap: 2px;
    }

    #page-qq-app .qq-chat-tool {
      width: 38px;
      height: 34px;
      padding: 4px 6px;
      border: 0;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: transparent;
      color: #111214;
      cursor: pointer;
      transition: transform .12s ease, background-color .16s ease, color .16s ease;
    }

    #page-qq-app .qq-chat-tool .qq-lucide-svg {
      width: 26px;
      height: 26px;
      stroke-width: 1.5;
    }

    #page-qq-app .qq-chat-tool[data-qq-chat-tool="ai-request"] .qq-lucide-svg {
      transform: scaleX(-1);
      transform-origin: center;
    }


    #page-qq-app .qq-chat-tool[data-qq-chat-tool="ai-request"][aria-busy="true"] {
      color: #111214;
      opacity: 1;
      cursor: pointer;
    }

    #page-qq-app .qq-chat-tool[data-qq-chat-tool="ai-request"]:disabled {
      color: #8f9298;
      opacity: .72;
      cursor: default;
    }

    #page-qq-app .qq-chat-tool[data-qq-chat-tool="more"] .qq-lucide-svg {
      transition: transform .18s ease;
      transform-origin: center;
    }

    #page-qq-app .qq-chat-tool[data-qq-chat-tool="more"].is-open {
      background: transparent;
      color: var(--qq-blue);
    }

    #page-qq-app .qq-chat-tool[data-qq-chat-tool="more"].is-open .qq-lucide-svg {
      transform: rotate(45deg);
    }

    /* 聊天底部拓展功能：双页横向分页，第二页首位固定为线下长文入口。 */
    #page-qq-app .qq-chat-more-panel {
      min-height: 0;
      max-height: 0;
      overflow: hidden;
      visibility: hidden;
      opacity: 0;
      pointer-events: none;
      transform: translateY(8px);
      transition: max-height .22s ease, opacity .18s ease, transform .22s ease, visibility 0s linear .22s;
    }

    #page-qq-app .qq-chat-more-panel.is-open {
      max-height: 286px;
      visibility: visible;
      opacity: 1;
      pointer-events: auto;
      transform: translateY(0);
      transition: max-height .22s ease, opacity .18s ease, transform .22s ease, visibility 0s linear 0s;
    }

    #page-qq-app .qq-chat-more-pages {
      width: 100%;
      display: flex;
      overflow-x: auto;
      overflow-y: hidden;
      scroll-snap-type: x mandatory;
      scroll-behavior: smooth;
      overscroll-behavior-x: contain;
      scrollbar-width: none;
      -ms-overflow-style: none;
    }

    #page-qq-app .qq-chat-more-pages::-webkit-scrollbar {
      display: none;
    }

    #page-qq-app .qq-chat-more-page {
      min-width: 100%;
      flex: 0 0 100%;
      scroll-snap-align: start;
      scroll-snap-stop: always;
    }

    #page-qq-app .qq-chat-more-grid {
      min-height: 196px;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      align-content: start;
      column-gap: 10px;
      row-gap: 24px;
      padding: 26px 0 24px;
    }

    #page-qq-app .qq-chat-more-item {
      min-width: 0;
      padding: 0;
      border: 0;
      outline: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      background: transparent;
      color: #55565a;
      cursor: pointer;
      -webkit-tap-highlight-color: transparent;
      transition: transform .12s ease, color .16s ease;
    }

    #page-qq-app .qq-chat-more-item.is-active {
      color: var(--theme-color);
    }

    #page-qq-app .qq-chat-more-item:active {
      transform: scale(.95);
    }

    #page-qq-app .qq-chat-more-name {
      width: 100%;
      min-width: 0;
      overflow: hidden;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 400;
      line-height: 1.2;
      text-align: center;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-chat-more-pager {
      height: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 0 0 10px;
    }

    #page-qq-app .qq-chat-more-dot {
      width: 5px;
      height: 5px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: rgba(23, 24, 27, .18);
      cursor: pointer;
      transition: width .16s ease, border-radius .16s ease, background .16s ease;
    }

    #page-qq-app .qq-chat-more-dot.is-active {
      width: 14px;
      border-radius: 999px;
      background: rgba(23, 24, 27, .66);
    }

    #page-qq-app .qq-dynamic-group {
      background: var(--qq-surface);
    }

    #page-qq-app .qq-dynamic-row {
      position: relative;
      width: 100%;
      min-height: 52px;
      padding: 0 15px;
      border: 0;
      background: var(--qq-surface);
      color: var(--qq-text);
      display: grid;
      grid-template-columns: 26px minmax(0, 1fr) 14px;
      align-items: center;
      gap: 10px;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-dynamic-row + .qq-dynamic-row::before {
      content: "";
      position: absolute;
      left: 56px;
      right: 0;
      top: 0;
      height: 1px;
      background: var(--qq-soft);
    }

    #page-qq-app .qq-dynamic-icon {
      width: 24px;
      height: 24px;
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-dynamic-icon .qq-lucide-svg {
      stroke-width: 1.8;
    }

    #page-qq-app .qq-dynamic-icon[data-qq-color="yellow"] { color: #ffc400; }
    #page-qq-app .qq-dynamic-icon[data-qq-color="yellow-soft"] { color: #ffca16; }
    #page-qq-app .qq-dynamic-icon[data-qq-color="blue"] { color: #159fe8; }
    #page-qq-app .qq-dynamic-icon[data-qq-color="green"] { color: #66d49c; }
    #page-qq-app .qq-dynamic-icon[data-qq-color="purple"] { color: #7163ec; }
    #page-qq-app .qq-dynamic-icon[data-qq-color="red"] { color: #ef5b48; }
    #page-qq-app .qq-dynamic-icon[data-qq-color="orange"] { color: #f2b943; }

    #page-qq-app .qq-dynamic-label {
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-channel-panel {
      padding-top: 0;
    }

    #page-qq-app .qq-channel-post {
      padding: 14px 14px 13px;
      background: var(--qq-surface);
      border-bottom: 1px solid #efefef;
    }

    #page-qq-app .qq-post-head {
      display: grid;
      grid-template-columns: 32px minmax(0, 1fr) auto 18px;
      align-items: center;
      gap: 7px;
    }

    #page-qq-app .qq-post-avatar {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: #d7d9dd;
    }

    #page-qq-app .qq-post-avatar[data-qq-tone="rose"] {
      background: #d8c4bb;
    }

    #page-qq-app .qq-post-author {
      min-width: 0;
    }

    #page-qq-app .qq-post-author strong {
      display: block;
      overflow: hidden;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #page-qq-app .qq-post-author small {
      display: block;
      margin-top: 3px;
      color: #a0a3a9;
      font-size: calc(9px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-follow {
      height: 26px;
      padding: 0 12px;
      border: 0;
      border-radius: 13px;
      background: #f2f6ff;
      color: #2675d8;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      cursor: pointer;
    }

    #page-qq-app .qq-more {
      width: 18px;
      height: 20px;
      padding: 3px 2px;
      border: 0;
      background: transparent;
      color: #c3c4c8;
      cursor: pointer;
    }

    #page-qq-app .qq-more .qq-lucide-svg {
      stroke-width: 2;
    }

    #page-qq-app .qq-post-title {
      margin: 8px 0 9px;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
    }

    #page-qq-app .qq-media-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
    }

    #page-qq-app .qq-media-placeholder {
      aspect-ratio: 1 / 1;
      border-radius: 10px;
      background: #f1dfb4;
    }

    #page-qq-app .qq-media-grid[data-palette="warm-1"] .qq-media-placeholder:nth-child(2) { background: #78848a; }
    #page-qq-app .qq-media-grid[data-palette="warm-1"] .qq-media-placeholder:nth-child(3) { background: #777c75; }
    #page-qq-app .qq-media-grid[data-palette="warm-2"] .qq-media-placeholder:nth-child(1) { background: #9a7d62; }
    #page-qq-app .qq-media-grid[data-palette="warm-2"] .qq-media-placeholder:nth-child(2) { background: #746b61; }
    #page-qq-app .qq-media-grid[data-palette="warm-2"] .qq-media-placeholder:nth-child(3) { background: #a46f46; }

    #page-qq-app .qq-reaction-list {
      display: flex;
      flex-wrap: wrap;
      gap: 5px 6px;
      margin-top: 8px;
    }

    #page-qq-app .qq-reaction {
      min-height: 22px;
      padding: 0 8px;
      border-radius: 11px;
      background: var(--qq-soft);
      color: #303238;
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-reaction-icon {
      width: 14px;
      height: 14px;
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-reaction-icon .qq-lucide-svg {
      stroke-width: 1.75;
    }

    #page-qq-app .qq-reaction[data-tone="love"] .qq-reaction-icon { color: #ef4f7a; }
    #page-qq-app .qq-reaction[data-tone="neutral"] .qq-reaction-icon { color: #292b2f; }
    #page-qq-app .qq-reaction[data-tone="laugh"] .qq-reaction-icon { color: #d99543; }
    #page-qq-app .qq-reaction[data-tone="taste"] .qq-reaction-icon { color: #ea6f52; }
    #page-qq-app .qq-reaction[data-tone="eat"] .qq-reaction-icon { color: #58bb89; }
    #page-qq-app .qq-reaction[data-tone="learn"] .qq-reaction-icon { color: #d8a24d; }

    #page-qq-app .qq-post-metrics {
      margin-top: 10px;
      display: flex;
      align-items: center;
      gap: 17px;
      color: #26282c;
    }

    #page-qq-app .qq-post-views {
      margin-right: auto;
      color: #a4a6ac;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-metric {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-metric-icon {
      width: 16px;
      height: 16px;
      color: #17191d;
    }

    #page-qq-app .qq-metric-icon .qq-lucide-svg {
      stroke-width: 1.65;
    }

    #page-qq-app .qq-bottom-nav {
      width: min(100%, var(--qq-frame-width));
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      padding: 3px 5px max(15px, env(safe-area-inset-bottom));
      border-top: 1px solid #ededee;
      background: var(--qq-soft);
    }

    #page-qq-app .qq-nav-item {
      min-width: 0;
      min-height: 44px;
      padding: 2px 0 1px;
      border: 0;
      background: transparent;
      color: #14161a;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2px;
      cursor: pointer;
    }

    #page-qq-app .qq-nav-symbol {
      width: 24px;
      height: 24px;
      padding: 2px;
      border-radius: 50%;
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-nav-symbol .qq-lucide-svg {
      width: 21px;
      height: 21px;
      stroke-width: 1.8;
    }

    #page-qq-app .qq-nav-item.is-active {
      color: var(--qq-blue);
    }

    #page-qq-app .qq-nav-item[data-qq-tab="channels"].is-active .qq-nav-symbol {
      width: 24px;
      height: 24px;
      padding: 4px;
      background: var(--qq-blue);
      color: #fff;
    }

    #page-qq-app .qq-nav-item[data-qq-tab="channels"].is-active .qq-nav-symbol .qq-lucide-svg {
      width: 17px;
      height: 17px;
      stroke-width: 2;
    }

    #page-qq-app .qq-nav-item[data-qq-tab="messages"].is-active .qq-nav-symbol .qq-lucide-svg {
      fill: currentColor;
    }

    #page-qq-app .qq-nav-label {
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1;
    }

    #page-qq-app .qq-side-view {
      grid-area: 1 / 1;
      justify-self: center;
      width: min(100%, var(--qq-frame-width));
      height: 100%;
      min-height: 0;
      display: none;
      overflow-y: auto;
      overscroll-behavior: contain;
      background: var(--qq-surface);
      color: var(--qq-text);
      touch-action: pan-y;
    }
#page-qq-app[data-qq-view="side"] .qq-side-view {
      display: block;
    }

    #page-qq-app .qq-side-layout {
      min-height: 100%;
      display: flex;
      flex-direction: column;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-side-hero {
      min-height: 177px;
      padding: 14px 15px 0;
      background: #87939a;
      background-position: center calc(50% + 10px);
      background-size: cover;
      background-repeat: no-repeat;
    }

    #page-qq-app .qq-side-topbar {
      display: flex;
      align-items: center;
      gap: 7px;
    }

    #page-qq-app .qq-side-topbar-spacer {
      flex: 1;
    }

    #page-qq-app .qq-side-pill,
    #page-qq-app .qq-side-close {
      border: 0;
      background: rgba(120, 124, 132, .18);
      color: #ffffff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
    }

    #page-qq-app .qq-side-pill {
      height: 32px;
      padding: 0 11px;
      border-radius: 999px;
      gap: 5px;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1;
    }

    #page-qq-app .qq-side-pill-icon {
      width: 17px;
      height: 17px;
      flex: 0 0 17px;
    }

    #page-qq-app .qq-side-pill-icon .qq-lucide-svg {
      stroke-width: 1.65;
    }

    #page-qq-app .qq-side-close {
      width: 32px;
      height: 32px;
      padding: 7px;
      border-radius: 50%;
    }

    #page-qq-app .qq-side-close .qq-lucide-svg {
      stroke-width: 1.55;
    }

    #page-qq-app .qq-side-profile-wrap {
      margin-top: -2px;
      padding: 0 8px;
    }

    #page-qq-app .qq-side-profile-card {
      min-height: 182px;
      padding: 16px 14px 12px;
      border: 1px solid #e7e7e8;
      border-radius: 14px;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-side-profile-head {
      display: grid;
      grid-template-columns: 72px minmax(0, 1fr) 26px;
      align-items: start;
      gap: 10px;
    }

    #page-qq-app .qq-side-avatar {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      background: #d8dade;
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .035);
    }

    #page-qq-app .qq-side-profile-main {
      min-width: 0;
      padding-top: 2px;
    }

    #page-qq-app .qq-side-name-row {
      display: flex;
      align-items: center;
      gap: 7px;
      min-width: 0;
    }

    #page-qq-app .qq-side-name {
      margin: 0;
      font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      line-height: 1.2;
      white-space: nowrap;
    }

    #page-qq-app .qq-side-switch-account {
      height: 25px;
      padding: 0 8px;
      border: 1px solid #e5e5e6;
      border-radius: 999px;
      background: var(--qq-surface);
      color: #23252a;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      cursor: pointer;
      white-space: nowrap;
    }

    #page-qq-app .qq-side-bio {
      margin: 9px 0 0;
      color: #74777e;
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
    }

    #page-qq-app .qq-side-bio-icon {
      width: 11px;
      height: 11px;
      flex: 0 0 11px;
    }

    #page-qq-app .qq-side-bio-icon .qq-lucide-svg {
      stroke-width: 1.55;
    }

    #page-qq-app .qq-side-level {
      display: inline-flex;
      align-items: center;
      gap: 2px;
      min-height: 13px;
      margin-top: 7px;
      color: #ffd538;
      line-height: 1;
    }

    #page-qq-app .qq-side-level-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 12px;
      height: 12px;
      flex: 0 0 auto;
    }

    #page-qq-app .qq-side-level-icon[data-qq-rank="crown"] {
      width: 14px;
      height: 12px;
    }

    #page-qq-app .qq-side-level-icon[data-qq-rank="sun"] {
      width: 12.5px;
      height: 12.5px;
    }

    #page-qq-app .qq-side-level-icon .qq-fa-level-svg {
      display: block;
      width: 100%;
      height: 100%;
      fill: currentColor;
    }

    #page-qq-app .qq-side-code {
      width: 26px;
      height: 26px;
      padding: 3px;
      border: 0;
      background: transparent;
      color: #111317;
      cursor: pointer;
    }

    #page-qq-app .qq-side-code .qq-lucide-svg {
      stroke-width: 1.75;
    }

    #page-qq-app .qq-side-tag-row {
      margin-top: 10px;
    }

    #page-qq-app .qq-side-add-tag {
      height: 26px;
      padding: 0 9px;
      border: 1px solid #e8e8e9;
      border-radius: 999px;
      background: var(--qq-surface);
      color: #25272b;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      cursor: pointer;
    }

    #page-qq-app .qq-side-add-tag-icon {
      width: 12px;
      height: 12px;
      flex: 0 0 12px;
    }

    #page-qq-app .qq-side-add-tag-icon .qq-lucide-svg {
      stroke-width: 1.7;
    }

    #page-qq-app .qq-side-card-foot {
      margin-top: 24px;
      display: flex;
      align-items: center;
      gap: 9px;
      min-width: 0;
    }

    #page-qq-app .qq-side-interactions {
      min-width: 0;
      flex: 1;
      display: flex;
      align-items: center;
      gap: 7px;
      color: #1a1c20;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
    }

    #page-qq-app .qq-side-interaction-icon {
      width: 15px;
      height: 15px;
      color: #14161a;
    }

    #page-qq-app .qq-side-interaction-icon[data-qq-accent="blue"] {
      color: #159fe8;
    }

    #page-qq-app .qq-side-interaction-divider {
      width: 1px;
      height: 14px;
      background: #e0e0e1;
    }

    #page-qq-app .qq-side-show-button {
      height: 28px;
      padding: 0 9px;
      border: 1px solid #e6e6e8;
      border-radius: 999px;
      background: var(--qq-surface);
      color: #25272b;
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      cursor: pointer;
      white-space: nowrap;
    }

    #page-qq-app .qq-side-show-icon {
      width: 15px;
      height: 15px;
      color: #13b7ef;
    }

    #page-qq-app .qq-side-menu {
      padding: 18px 14px 0;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-side-menu-row {
      width: 100%;
      min-height: 49px;
      padding: 0 2px;
      border: 0;
      background: var(--qq-surface);
      color: var(--qq-text);
      display: grid;
      grid-template-columns: 25px minmax(0, 1fr) auto 14px;
      align-items: center;
      gap: 11px;
      text-align: left;
      cursor: pointer;
    }

    #page-qq-app .qq-side-menu-icon {
      width: 23px;
      height: 23px;
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-side-menu-icon .qq-lucide-svg {
      stroke-width: 1.75;
    }

    #page-qq-app .qq-side-menu-icon[data-qq-color="yellow"] { color: #f8c500; }
    #page-qq-app .qq-side-menu-icon[data-qq-color="blue"] { color: #13a7e8; }
    #page-qq-app .qq-side-menu-icon[data-qq-color="pink"] { color: #ef5975; }
    #page-qq-app .qq-side-menu-icon[data-qq-color="green"] { color: #1fc38d; }

    #page-qq-app .qq-side-menu-label {
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1;
    }

    #page-qq-app .qq-side-menu-note {
      color: #96999f;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
    }

    #page-qq-app .qq-side-menu-divider {
      height: 1px;
      margin: 8px 0 6px 0;
      background: var(--qq-soft);
    }

    #page-qq-app .qq-side-footer-spacer {
      flex: 1;
      min-height: 72px;
    }

    #page-qq-app .qq-side-footer {
      width: 220px;
      padding: 6px 14px 22px;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 0;
      background: var(--qq-surface);
    }

    #page-qq-app .qq-side-footer-item {
      min-height: 49px;
      padding: 0;
      border: 0;
      background: transparent;
      color: #17191d;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 4px;
      cursor: pointer;
    }

    #page-qq-app .qq-side-footer-icon {
      width: 23px;
      height: 23px;
    }

    #page-qq-app .qq-side-footer-icon .qq-lucide-svg {
      stroke-width: 1.75;
    }

    #page-qq-app .qq-side-footer-label {
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1;
    }

    #page-qq-app .qq-self-profile-view,
    #page-qq-app .qq-wallet-view {
      grid-area: 1 / 1;
      justify-self: center;
      width: min(100%, var(--qq-frame-width));
      height: 100%;
      min-height: 0;
      display: none;
      overflow: hidden;
      background: var(--qq-surface);
      color: var(--qq-text);
    }

    #page-qq-app[data-qq-view="self-profile"] .qq-main-view,
    #page-qq-app[data-qq-view="self-profile"] .qq-side-view,
    #page-qq-app[data-qq-view="wallet"] .qq-main-view,
    #page-qq-app[data-qq-view="wallet"] .qq-side-view {
      display: none;
    }

    #page-qq-app[data-qq-view="self-profile"] .qq-self-profile-view,
    #page-qq-app[data-qq-view="wallet"] .qq-wallet-view {
      display: block;
    }

    #page-qq-app .qq-side-hero,
    #page-qq-app .qq-side-avatar {
      cursor: pointer;
    }

    #page-qq-app .qq-self-profile-layout {
      height: 100%;
      min-height: 0;
      position: relative;
      display: grid;
      grid-template-rows: minmax(0, 1fr) auto;
      background: #f1f2f4;
    }

    #page-qq-app .qq-self-profile-scroll {
      min-height: 0;
      overflow-y: auto;
      background: #f1f2f4;
    }
#page-qq-app .qq-self-cover {
      height: 171px;
      position: relative;
      padding: 13px 12px;
      background-color: #87939a;
      background-position: center calc(50% + 10px);
      background-size: cover;
      background-repeat: no-repeat;
      color: #ffffff;
      cursor: pointer;
    }

    #page-qq-app .qq-self-cover-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      pointer-events: none;
    }

    #page-qq-app .qq-self-cover-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      pointer-events: auto;
    }

    #page-qq-app .qq-self-cover-action {
      width: 34px;
      height: 34px;
      padding: 7px;
      border: 0;
      border-radius: 50%;
      background: rgba(20, 22, 25, .18);
      color: #ffffff;
      display: grid;
      place-items: center;
      cursor: pointer;
      pointer-events: auto;
    }

    #page-qq-app .qq-self-cover-action .qq-lucide-svg { stroke-width: 1.7; }

    #page-qq-app .qq-self-profile-card {
      min-height: 244px;
      margin-top: -1px;
      padding: 22px 14px 15px;
      border-radius: 18px 18px 0 0;
      position: relative;
      background: #ffffff;
    }

    #page-qq-app .qq-self-profile-head {
      display: grid;
      grid-template-columns: 78px minmax(0, 1fr) 42px;
      align-items: start;
      gap: 12px;
    }

    #page-qq-app .qq-self-avatar {
      width: 78px;
      height: 78px;
      margin-top: -5px;
      border-radius: 50%;
      background: #d8dade center / cover no-repeat;
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .04);
    }

    #page-qq-app .qq-self-name {
      margin: 5px 0 0;
      font-size: calc(19px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      line-height: 1.2;
    }

    #page-qq-app .qq-self-identity-name-row {
      margin-top: 5px;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 7px;
    }

    #page-qq-app .qq-self-identity-name-row .qq-self-name { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

    #page-qq-app .qq-self-status-pill {
      height: 24px;
      padding: 0 8px;
      border: 1px solid #e4e5e7;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      color: #34363b;
      background: #fff;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
    }

    #page-qq-app .qq-self-status-pill .qq-lucide-svg { width: 13px; height: 13px; }

    #page-qq-app .qq-self-number {
      margin: 7px 0 0;
      color: #9a9da3;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-self-like {
      border: 0;
      background: transparent;
      color: #17191d;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 1px;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-self-like .qq-lucide-svg { width: 20px; height: 20px; }

    #page-qq-app .qq-self-info-row {
      min-height: 40px;
      padding: 0 1px;
      border: 0;
      background: #ffffff;
      display: grid;
      grid-template-columns: minmax(0, 1fr) 18px;
      align-items: center;
      gap: 8px;
      color: #8e9197;
      text-align: left;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      cursor: pointer;
    }

    #page-qq-app .qq-self-profile-level {
      min-height: 38px;
      display: flex;
      align-items: center;
      gap: 4px;
    }

    #page-qq-app .qq-self-signature { border-bottom: 1px solid #ededee; }

    #page-qq-app .qq-self-add-tag {
      height: 29px;
      margin-top: 8px;
      padding: 0 9px;
      border: 1px solid #e3e4e6;
      border-radius: 8px;
      background: #ffffff;
      color: #202226;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
    }

    #page-qq-app .qq-self-section-gap { height: 10px; background: #f1f2f4; }

    #page-qq-app .qq-self-feature {
      min-height: 48px;
      padding: 0 14px;
      background: #ffffff;
      display: grid;
      grid-template-columns: 25px minmax(0, 1fr) auto 18px;
      align-items: center;
      gap: 10px;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-self-feature-icon { width: 21px; height: 21px; }
    #page-qq-app .qq-self-feature-note { color: #2f70b6; font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-self-chevron { width: 17px; height: 17px; color: #a4a6aa; }

    #page-qq-app .qq-self-profile-actions {
      padding: 9px 14px max(12px, env(safe-area-inset-bottom));
      display: grid;
      grid-template-columns: 1fr 1fr 1.08fr;
      gap: 7px;
      background: #ffffff;
      border-top: 1px solid #ededee;
    }

    #page-qq-app .qq-self-profile-action {
      height: 42px;
      border: 1px solid #dfe0e2;
      border-radius: 13px;
      background: #ffffff;
      color: #17191d;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-self-profile-action.is-primary {
      border-color: #129ee8;
      background: #129ee8;
      color: #ffffff;
    }

    #page-qq-app .qq-wallet-layout {
      height: 100%;
      min-height: 0;
      overflow-y: auto;
      background: #f3f3f4;
    }
#page-qq-app .qq-wallet-hero {
      min-height: 184px;
      padding: 10px 13px 20px;
      background: #12a4ef;
      color: #ffffff;
    }

    #page-qq-app .qq-wallet-top-actions { min-width: 82px; display: flex; justify-content: flex-end; justify-self: end; gap: 8px; }
    
    #page-qq-app .qq-wallet-top-action .qq-lucide-svg { stroke-width: 1.8; }

    #page-qq-app .qq-wallet-stats {
      margin-top: 24px;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      text-align: center;
    }

    #page-qq-app .qq-wallet-stat-value {
      min-width: 0;
      min-height: 31px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: calc(24px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 500;
      line-height: 1;
    }

    #page-qq-app .qq-wallet-stat-value[data-wallet-home-balance] {
      padding: 0 3px;
      overflow: visible;
      font-size: clamp(14px, 5.6vw, 24px);
      white-space: nowrap;
      font-variant-numeric: tabular-nums;
    }

    #page-qq-app .qq-wallet-stat-label { margin-top: 8px; font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale)); }

    #page-qq-app .qq-wallet-content {
      margin-top: -1px;
      border-radius: 9px 9px 0 0;
      overflow: hidden;
      background: #f3f3f4;
    }

    #page-qq-app .qq-wallet-section {
      padding: 12px 14px 18px;
      background: #ffffff;
    }

    #page-qq-app .qq-wallet-section + .qq-wallet-section { margin-top: 7px; }
    #page-qq-app .qq-wallet-section-title { margin: 0 0 14px; color: #9a9da2; font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale)); font-weight: 400; }
    #page-qq-app .qq-wallet-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 23px; }
    #page-qq-app .qq-wallet-grid.is-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    #page-qq-app .qq-wallet-item {
      min-width: 0;
      border: 0;
      background: transparent;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      color: #17191d;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      white-space: nowrap;
    }

    #page-qq-app .qq-wallet-item-icon { width: 26px; height: 26px; color: var(--wallet-icon, #14a8ea); }
    #page-qq-app .qq-wallet-item-icon .qq-lucide-svg { stroke-width: 1.8; }

    #page-qq-app .qq-wallet-view { position: relative; background: #f2f3f5; }
    #page-qq-app .qq-wallet-page {
      position: absolute;
      inset: 0;
      display: none;
      min-height: 0;
      overflow: hidden;
      background: #f2f3f5;
      color: #15171a;
    }
    #page-qq-app .qq-wallet-page.is-active { display: block; }
    #page-qq-app .qq-wallet-page-scroll {
      height: 100%;
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
    }
#page-qq-app .qq-wallet-topbar {
      min-height: 45px;
      display: grid;
      grid-template-columns: 38px minmax(0, 1fr) auto;
      align-items: center;
      position: relative;
    }
    #page-qq-app .qq-wallet-title {
      margin: 0;
      text-align: center;
      font-size: calc(18px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 450;
      position: absolute;
      left: 50%;
      max-width: calc(100% - 176px);
      transform: translateX(-50%);
      white-space: nowrap;
      pointer-events: none;
    }
    #page-qq-app .qq-wallet-stat-button {
      min-width: 0;
      padding: 0;
      border: 0;
      background: transparent;
      color: inherit;
      text-align: center;
    }

    #page-qq-app .qq-wallet-subheader {
      height: 57px;
      padding: 7px 11px 0;
      position: sticky;
      top: 0;
      z-index: 12;
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr) auto;
      align-items: center;
      background: #ffffff;
      color: #111318;
      box-shadow: 0 1px 0 rgba(25, 28, 33, .06);
    }
    #page-qq-app .qq-wallet-subheader.is-blue {
      background: #0099ff;
      color: #ffffff;
      box-shadow: none;
    }
    #page-qq-app .qq-wallet-subtitle {
      margin: 0;
      position: absolute;
      left: 50%;
      max-width: calc(100% - 150px);
      transform: translateX(-50%);
      text-align: center;
      font-size: calc(17px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 500;
      line-height: 1.2;
    }
    #page-qq-app .qq-wallet-nav-button {
      width: 38px;
      height: 38px;
      padding: 8px;
      border: 0;
      background: transparent;
      color: inherit;
      display: grid;
      place-items: center;
    }
    #page-qq-app .qq-wallet-nav-button .qq-lucide-svg { stroke-width: 1.8; }
    #page-qq-app .qq-wallet-nav-text {
      width: auto;
      padding: 0;
      justify-self: end;
      white-space: nowrap;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
    }

    #page-qq-app .qq-wallet-collect { background: #0099ff; color: #ffffff; }
    #page-qq-app .qq-wallet-collect-body { padding: 12px 16px 26px; }
    #page-qq-app .qq-wallet-receive-card {
      padding: 18px 18px 20px;
      border-radius: 13px;
      background: #ffffff;
      color: #191b1f;
      text-align: center;
      box-shadow: 0 6px 18px rgba(0, 85, 158, .12);
    }
    #page-qq-app .qq-wallet-receive-name {
      margin: 0 0 13px;
      font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
    }
    #page-qq-app .qq-wallet-qr {
      width: min(53vw, 205px);
      aspect-ratio: 1;
      margin: 0 auto 14px;
      padding: 8px;
      display: grid;
      grid-template-columns: repeat(25, 1fr);
      grid-template-rows: repeat(25, 1fr);
      gap: 0;
      background: #ffffff;
      border: 1px solid #edf0f2;
    }
    #page-qq-app .qq-wallet-qr-cell { background: transparent; }
    #page-qq-app .qq-wallet-qr-cell.is-dark { background: #111318; }
    #page-qq-app .qq-wallet-receive-note {
      margin: 0;
      color: #80858c;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-wallet-collect-menu {
      margin-top: 13px;
      border-radius: 12px;
      overflow: hidden;
      background: rgba(117, 199, 255, .48);
    }
    #page-qq-app .qq-wallet-collect-row {
      width: 100%;
      min-height: 55px;
      padding: 0 15px;
      border: 0;
      border-bottom: 1px solid rgba(255, 255, 255, .22);
      display: grid;
      grid-template-columns: 24px minmax(0, 1fr) 18px;
      align-items: center;
      gap: 12px;
      background: transparent;
      color: #ffffff;
      text-align: left;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-wallet-collect-row:last-child { border-bottom: 0; }
    #page-qq-app .qq-wallet-collect-row .qq-lucide-svg { stroke-width: 1.8; }
    #page-qq-app .qq-wallet-collect-row > .qq-lucide-svg:last-child { opacity: .82; }

    #page-qq-app .qq-wallet-settings-body { padding: 11px 0 26px; }
    #page-qq-app .qq-wallet-setting-group { background: #ffffff; }
    #page-qq-app .qq-wallet-setting-row {
      width: 100%;
      min-height: 55px;
      padding: 0 15px;
      border: 0;
      border-bottom: 1px solid #eceef0;
      background: #ffffff;
      color: #17191d;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto 18px;
      align-items: center;
      gap: 9px;
      text-align: left;
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-wallet-setting-row:last-child { border-bottom: 0; }
    #page-qq-app .qq-wallet-setting-value { color: #9a9da2; font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-wallet-setting-row .qq-lucide-svg { color: #a3a6aa; stroke-width: 1.8; }
    #page-qq-app .qq-wallet-switch {
      width: 43px;
      height: 25px;
      padding: 2px;
      border: 0;
      border-radius: 999px;
      background: #d6d8dc;
      transition: background .18s ease;
    }
    #page-qq-app .qq-wallet-switch::after {
      content: "";
      width: 21px;
      height: 21px;
      display: block;
      border-radius: 50%;
      background: #ffffff;
      box-shadow: 0 1px 3px rgba(0, 0, 0, .22);
      transition: transform .18s ease;
    }
    #page-qq-app .qq-wallet-switch[aria-checked="true"] { background: #13aaee; }
    #page-qq-app .qq-wallet-switch[aria-checked="true"]::after { transform: translateX(18px); }

    #page-qq-app .qq-wallet-password-page { background: #ffffff; }
    #page-qq-app .qq-wallet-password-body { min-height: calc(100% - 57px); display: flex; flex-direction: column; }
    #page-qq-app .qq-wallet-password-intro { padding: 48px 20px 24px; text-align: center; }
    #page-qq-app .qq-wallet-password-prompt {
      margin: 0;
      font-size: calc(18px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 500;
    }
    #page-qq-app .qq-wallet-password-help {
      margin: 8px 0 0;
      color: #92959a;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-wallet-pin-slots {
      width: min(82%, 318px);
      height: 48px;
      margin: 24px auto 0;
      border: 1px solid #cfd2d6;
      border-radius: 7px;
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      overflow: hidden;
      background: #ffffff;
    }
    #page-qq-app .qq-wallet-pin-slot { position: relative; border-right: 1px solid #e1e3e5; }
    #page-qq-app .qq-wallet-pin-slot:last-child { border-right: 0; }
    #page-qq-app .qq-wallet-pin-slot.is-filled::after {
      content: "";
      width: 10px;
      height: 10px;
      position: absolute;
      left: 50%;
      top: 50%;
      border-radius: 50%;
      background: #101215;
      transform: translate(-50%, -50%);
    }
    #page-qq-app .qq-wallet-keypad {
      margin-top: auto;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      background: #d2d5da;
      gap: 1px;
      border-top: 1px solid #c9ccd1;
    }
    #page-qq-app .qq-wallet-key {
      height: 56px;
      border: 0;
      background: #ffffff;
      color: #111318;
      display: grid;
      place-items: center;
      font-size: calc(22px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 450;
    }
    #page-qq-app .qq-wallet-key.is-muted { background: #e7e9ec; }
    #page-qq-app .qq-wallet-key .qq-lucide-svg { width: 23px; height: 23px; stroke-width: 1.8; }

    #page-qq-app .qq-wallet-gesture-page { background: #ffffff; }
    #page-qq-app .qq-wallet-gesture-body { padding: 92px 25px 30px; text-align: center; }
    #page-qq-app .qq-wallet-gesture-prompt {
      margin: 0 0 34px;
      color: #777b80;
      font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 400;
    }
    #page-qq-app .qq-wallet-gesture-pad {
      width: min(78vw, 330px);
      aspect-ratio: 1;
      margin: 0 auto;
      position: relative;
      touch-action: none;
      user-select: none;
    }
    #page-qq-app .qq-wallet-gesture-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
    #page-qq-app .qq-wallet-gesture-lines polyline { fill: none; stroke: #0aa6e8; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
    #page-qq-app .qq-wallet-gesture-points {
      position: absolute;
      inset: 0;
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: repeat(3, 1fr);
      place-items: center;
    }
    #page-qq-app .qq-wallet-gesture-point {
      width: 54px;
      height: 54px;
      padding: 0;
      border: 2px solid #85898e;
      border-radius: 50%;
      background: #ffffff;
      position: relative;
    }
    #page-qq-app .qq-wallet-gesture-point::after {
      content: "";
      width: 19px;
      height: 19px;
      position: absolute;
      left: 50%;
      top: 50%;
      border-radius: 50%;
      background: transparent;
      transform: translate(-50%, -50%);
    }
    #page-qq-app .qq-wallet-gesture-point.is-active { border-color: #65c8ec; background: rgba(10, 166, 232, .22); }
    #page-qq-app .qq-wallet-gesture-point.is-active::after { background: #0aa6e8; }

    #page-qq-app .qq-wallet-balance-card {
      min-height: 316px;
      padding: 42px 20px 30px;
      border-radius: 16px;
      background: #ffffff;
      text-align: center;
    }
    #page-qq-app .qq-wallet-balance-label { margin: 0; color: #9b9ea3; font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-wallet-balance-amount { margin: 13px 0 57px; max-width: 100%; overflow: visible; font-size: clamp(34px, 11vw, 54px); font-weight: 550; letter-spacing: .02em; line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums; }
    #page-qq-app .qq-wallet-transfer-button {
      width: min(75%, 260px);
      height: 48px;
      border: 1px solid #d7dadd;
      border-radius: 12px;
      background: #ffffff;
      color: #111318;
      font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 550;
    }
    #page-qq-app .qq-wallet-transfer-button + .qq-wallet-transfer-button { margin-top: 15px; }
    #page-qq-app .qq-wallet-transfer-button.is-primary { border-color: #0e9eea; background: #0e9eea; color: #ffffff; }
    #page-qq-app .qq-wallet-balance-menu {
      margin-top: 12px;
      padding: 0 20px;
      border-radius: 15px;
      background: #ffffff;
    }
    #page-qq-app .qq-wallet-balance-row {
      width: 100%;
      min-height: 59px;
      padding: 0;
      border: 0;
      border-bottom: 1px solid #eceef0;
      background: transparent;
      color: #17191d;
      display: grid;
      grid-template-columns: 25px minmax(0, 1fr) 18px;
      align-items: center;
      gap: 12px;
      text-align: left;
      font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-wallet-balance-row:last-child { border-bottom: 0; }
    #page-qq-app .qq-wallet-balance-row .qq-lucide-svg { stroke-width: 1.7; }
    #page-qq-app .qq-wallet-balance-row > .qq-lucide-svg:last-child { color: #a1a4a8; }

    #page-qq-app .qq-wallet-bill-toolbar {
      height: 54px;
      padding: 0 16px;
      display: grid;
      grid-template-columns: auto auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 21px;
      background: #f0f1f3;
      color: #8b8f94;
    }
    #page-qq-app .qq-wallet-bill-filter,
    #page-qq-app .qq-wallet-bill-download {
      border: 0;
      padding: 0;
      background: transparent;
      color: inherit;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-wallet-bill-download {
      width: 30px;
      height: 30px;
      padding: 0;
      display: grid;
      place-items: center;
      gap: 0;
      border-radius: 50%;
      cursor: pointer;
    }
    #page-qq-app .qq-wallet-bill-download .qq-lucide-svg { width: 15px; height: 15px; stroke-width: 1.7; }

    #page-qq-app .qq-wallet-bill-filter select {
      max-width: 106px;
      border: 0;
      outline: 0;
      appearance: none;
      background: transparent;
      color: inherit;
      font: inherit;
    }
    #page-qq-app .qq-wallet-bill-list { background: #ffffff; }
    #page-qq-app .qq-wallet-bill-empty { padding: 90px 20px; color: #9ca0a5; text-align: center; font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-wallet-bill-month { padding: 18px 16px 7px; font-size: calc(17px * var(--user-font-size-scale) * var(--display-scale)); font-weight: 600; }
    #page-qq-app .qq-wallet-bill-row {
      min-height: 75px;
      margin-left: 16px;
      padding: 11px 16px 11px 0;
      border-bottom: 1px solid #eceef0;
      display: grid;
      grid-template-columns: 43px minmax(0, 1fr) auto;
      align-items: center;
      gap: 13px;
    }
    #page-qq-app .qq-wallet-bill-icon {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: var(--bill-color, #10a6ed);
      color: #ffffff;
    }
    #page-qq-app .qq-wallet-bill-icon .qq-lucide-svg { width: 21px; height: 21px; stroke-width: 1.9; }
    #page-qq-app .qq-wallet-bill-name { margin: 0; font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-wallet-bill-time { margin: 5px 0 0; color: #92969b; font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale)); }
    #page-qq-app .qq-wallet-bill-amount { font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale)); font-weight: 500; white-space: nowrap; }
    #page-qq-app .qq-wallet-bill-amount.is-income { color: #1acb7c; }

    #page-qq-app .qq-wallet-cards-body { padding: 14px 14px 30px; }
    #page-qq-app .qq-wallet-card-empty { padding: 100px 20px; color: #969a9f; text-align: center; }

    #page-qq-app .qq-wallet-mastercard-symbol::before { left: 0; background: #eb001b; }
    #page-qq-app .qq-wallet-mastercard-symbol::after { right: 0; background: #f79e1b; mix-blend-mode: screen; }

    #page-qq-app .qq-wallet-card-assets-label { color: rgba(255,255,255,.64); font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale)); }

    /* QQ 钱包表单只提供内容；居中壳、标题、按钮、滚动与过渡全部由 GlobalModal 负责。 */
    #theme-global-modal-overlay .qq-wallet-modal-form { margin: 0; }
    #theme-global-modal-overlay .qq-wallet-modal-fields { display: grid; gap: var(--global-modal-input-gap); }
    #theme-global-modal-overlay .qq-wallet-field { margin: 0; }
    #theme-global-modal-overlay .qq-wallet-field label { display: block; margin-bottom: 6px; color: var(--ui-muted); font-size: var(--global-modal-message-size); }
    #theme-global-modal-overlay .qq-wallet-field input,
    #theme-global-modal-overlay .qq-wallet-field select {
      width: 100%;
      height: var(--global-modal-control-height);
      padding: var(--global-modal-input-padding);
      border: 1px solid var(--ui-line);
      border-radius: var(--global-modal-control-radius);
      outline: 0;
      background: var(--ui-surface-secondary);
      color: var(--ui-text);
      font: inherit;
      font-size: var(--global-modal-action-size);
    }
    #theme-global-modal-overlay .qq-wallet-field input:focus,
    #theme-global-modal-overlay .qq-wallet-field select:focus { border-color: #B8B8BE; background: var(--ui-surface); box-shadow: none; }
    #theme-global-modal-overlay .qq-wallet-field-error { min-height: 17px; margin: 8px 0 0; color: var(--ui-danger); font-size: var(--global-modal-message-size); }

    /* QQ 钱包组件细节：图标几何、余额渐变、金额弹窗与银行卡视觉。 */
    #page-qq-app .qq-wallet-top-action {
      width: 34px;
      height: 34px;
      padding: 6px;
      border: 0;
      background: transparent;
      color: #ffffff;
      display: grid;
      place-items: center;
      flex: 0 0 34px;
    }
    #page-qq-app .qq-wallet-top-action > .qq-lucide-svg,
    #page-qq-app .qq-wallet-nav-button > .qq-lucide-svg { width: 22px; height: 22px; }
    #page-qq-app .qq-wallet-scan-symbol {
      position: relative;
      display: block;
      width: 23px;
      height: 23px;
    }
    #page-qq-app .qq-wallet-scan-symbol .qq-wallet-scan-frame {
      position: absolute;
      inset: 0;
      width: 23px;
      height: 23px;
      stroke-width: 1.75;
    }
    #page-qq-app .qq-wallet-scan-symbol .qq-wallet-scan-yen {
      position: absolute;
      inset: auto;
      left: 7px;
      top: 6px;
      width: 9px;
      height: 11px;
      stroke-width: 2.15;
    }
    #page-qq-app .qq-wallet-stat-value .qq-lucide-svg {
      stroke-width: 1.8;
      width: 27px;
      height: 27px;
    }
    #page-qq-app .qq-wallet-collect-row > .qq-lucide-svg:first-child,
    #page-qq-app .qq-wallet-balance-row > .qq-lucide-svg:first-child { width: 21px; height: 21px; }
    #page-qq-app .qq-wallet-collect-row > .qq-lucide-svg:last-child,
    #page-qq-app .qq-wallet-balance-row > .qq-lucide-svg:last-child,
    #page-qq-app .qq-wallet-setting-row > .qq-lucide-svg:last-child { width: 17px; height: 17px; }
    #page-qq-app .qq-wallet-balance-page {
      background: #f2f3f5;
    }
    #page-qq-app .qq-wallet-balance-page .qq-wallet-page-scroll {
      background: linear-gradient(180deg, #079ff1 0, #21acf3 116px, #bce6fb 238px, #eef3f6 360px, #f2f3f5 470px);
    }
    #page-qq-app .qq-wallet-balance-body {
      padding: 13px 16px 28px;
      min-height: calc(100% - 57px);
    }
    #page-qq-app .qq-wallet-cards-header [data-qq-wallet-action="add-card"] {
      position: absolute;
      right: 10px;
      top: 10px;
      z-index: 2;
    }
    #page-qq-app .qq-wallet-bank-card {
      margin-bottom: 13px;
      position: relative;
      overflow: hidden;
      color: #ffffff;
      width: 100%;
      min-height: 0;
      aspect-ratio: 1.586 / 1;
      padding: 20px 21px 18px;
      border: 1px solid rgba(255,255,255,.34);
      border-radius: 18px;
      background: radial-gradient(circle at 86% 12%, rgba(255,255,255,.26), transparent 27%),
        linear-gradient(118deg, rgba(255,255,255,.17), transparent 32%, rgba(0,0,0,.11) 66%, rgba(255,255,255,.08)),
        linear-gradient(145deg, #777b80 0%, #5f646a 42%, #3d4248 100%);
      box-shadow: 0 9px 22px rgba(38, 42, 47, .2), inset 0 1px 0 rgba(255,255,255,.24);
    }
    #page-qq-app .qq-wallet-bank-card::before {
      content: "";
      position: absolute;
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 50%;
      width: 245px;
      height: 245px;
      right: -104px;
      top: -124px;
      box-shadow: 0 0 0 34px rgba(255,255,255,.035), 0 0 0 68px rgba(0,0,0,.025);
    }
    #page-qq-app .qq-wallet-bank-card::after {
      content: "";
      position: absolute;
      left: -15%;
      right: -15%;
      bottom: 29%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
      transform: rotate(-8deg);
    }
    #page-qq-app .qq-wallet-bank-head {
      position: relative;
      z-index: 1;
      display: flex;
      justify-content: space-between;
      gap: 14px;
      align-items: center;
    }
    #page-qq-app .qq-wallet-bank-identity { display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 10px; }
    #page-qq-app .qq-wallet-bank-emblem {
      width: 30px;
      height: 30px;
      padding: 6px;
      border-radius: 9px;
      display: grid;
      place-items: center;
      background: rgba(255,255,255,.15);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.13);
    }
    #page-qq-app .qq-wallet-bank-emblem .qq-lucide-svg { width: 18px; height: 18px; stroke-width: 1.7; }
    #page-qq-app .qq-wallet-bank-name {
      margin: 0;
      font-weight: 600;
      font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale));
      letter-spacing: .02em;
    }
    #page-qq-app .qq-wallet-bank-type {
      margin: 3px 0 0;
      color: rgba(255,255,255,.67);
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-wallet-card-number {
      margin: 39px 0 0;
      position: relative;
      z-index: 1;
      margin-top: 39px;
      font-size: calc(17px * var(--user-font-size-scale) * var(--display-scale));
      letter-spacing: .15em;
      font-variant-numeric: tabular-nums;
    }
    #page-qq-app .qq-wallet-card-foot {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 12px;
      margin-top: 25px;
    }
    #page-qq-app .qq-wallet-card-assets {
      margin-top: 3px;
      font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      font-variant-numeric: tabular-nums;
      letter-spacing: .03em;
    }
    #page-qq-app .qq-wallet-mastercard-symbol {
      position: relative;
      flex: 0 0 auto;
      width: 47px;
      height: 29px;
    }
    #page-qq-app .qq-wallet-mastercard-symbol::before,
    #page-qq-app .qq-wallet-mastercard-symbol::after {
      content: "";
      position: absolute;
      top: 0;
      border-radius: 50%;
      opacity: .96;
      width: 29px;
      height: 29px;
    }
    #page-qq-app .qq-wallet-mastercard-word {
      font-weight: 600;
      color: rgba(255,255,255,.78);
      font-size: 10px;
      letter-spacing: .04em;
      text-transform: lowercase;
    }

    /* 红包与转账：聊天内独立卡片和居中业务面板。 */
    #page-qq-app button.qq-chat-commerce-card {
      width: min(68vw, 230px);
      padding: 0;
      border: 0;
      border-radius: 9px;
      overflow: hidden;
      display: block;
      color: #ffffff;
      text-align: left;
      box-shadow: 0 2px 8px rgba(32, 35, 40, .10);
      cursor: pointer;
    }
    #page-qq-app .qq-chat-commerce-card.is-red-packet { background: #fa9d3b; }
    #page-qq-app .qq-chat-commerce-card.is-transfer { background: #3c9fe8; }
    #page-qq-app .qq-chat-commerce-main {
      min-height: 66px;
      padding: 10px 13px;
      display: grid;
      grid-template-columns: 42px minmax(0, 1fr);
      align-items: center;
      gap: 12px;
    }
    #page-qq-app .qq-chat-commerce-emblem {
      width: 42px;
      height: 42px;
      border-radius: 6px;
      display: grid;
      place-items: center;
      background: rgba(255,255,255,.22);
      color: #ffffff;
      -webkit-text-fill-color: #ffffff;
      box-shadow: none;
    }
    #page-qq-app button.qq-chat-commerce-card .qq-chat-commerce-emblem > svg { width: 23px; height: 23px; display: block; color: #ffffff; fill: #ffffff; }
    #page-qq-app button.qq-chat-commerce-card .qq-chat-commerce-title {
      display: block;
      color: #ffffff;
      -webkit-text-fill-color: #ffffff;
      overflow: hidden;
      font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 550;
      line-height: 1.25;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    #page-qq-app .qq-chat-commerce-note {
      display: block;
      margin-top: 4px;
      color: rgba(255,255,255,.76);
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.2;
    }
    #page-qq-app .qq-chat-commerce-foot {
      min-height: 23px;
      padding: 0 10px 0 12px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      background: #ffffff;
      color: #96999e;
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-chat-commerce-type,
    #page-qq-app .qq-chat-commerce-state {
      display: block;
      min-width: 0;
      line-height: 1;
      white-space: nowrap;
    }
    #page-qq-app .qq-chat-commerce-state {
      margin-left: auto;
      text-align: right;
      color: #a4a6aa;
      font-size: calc(9.5px * var(--user-font-size-scale) * var(--display-scale));
    }
    #page-qq-app .qq-chat-commerce-card.is-complete.is-red-packet { background: #f2c589; }
    #page-qq-app .qq-chat-commerce-card.is-complete.is-transfer { background: #91bee0; }

    /* 红包 / 转账 / 定位统一使用核心 GlobalModal；这里只保留业务内容，不再创建 QQ 私有遮罩层。 */
    #theme-modal-extra .qq-chat-location-form,
    #theme-modal-extra .qq-chat-commerce-modal {
      display: grid;
      gap: 12px;
      margin-top: 16px;
    }

    #theme-modal-extra .qq-chat-modal-field {
      display: grid;
      gap: 7px;
      min-width: 0;
    }

    #theme-modal-extra .qq-chat-modal-field-label {
      color: var(--ui-muted);
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      line-height: 1.25;
    }

    #theme-modal-extra .qq-chat-modal-field > .global-modal-input,
    #theme-modal-extra .qq-chat-modal-input {
      margin-top: 0;
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    #theme-modal-extra .qq-chat-commerce-modal-amount {
      width: 100%;
      min-height: var(--global-modal-control-height);
      padding: 0 12px;
      border: 1px solid var(--ui-line);
      border-radius: var(--global-modal-control-radius);
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 8px;
      background: var(--ui-surface-secondary);
      box-sizing: border-box;
    }

    #theme-modal-extra .qq-chat-commerce-modal-amount:focus-within {
      border-color: #b8b8be;
      background: var(--ui-surface);
    }

    #theme-modal-extra .qq-chat-commerce-modal-currency {
      color: var(--ui-text);
      font-size: 19px;
      font-weight: 650;
    }

    #theme-modal-extra .qq-chat-commerce-modal-amount input {
      width: 100%;
      min-width: 0;
      height: calc(var(--global-modal-control-height) - 2px);
      padding: 0;
      border: 0;
      outline: 0;
      background: transparent;
      color: var(--ui-text);
      font: inherit;
      font-size: 22px;
      font-weight: 650;
      font-variant-numeric: tabular-nums;
    }

    #theme-modal-extra .qq-chat-commerce-modal-balance {
      margin: -2px 1px 0;
      color: var(--ui-muted);
      font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
    }

    #theme-modal-extra .qq-chat-commerce-modal-error {
      min-height: 16px;
      margin-top: -4px;
      color: #d64045;
      font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
    }

    /* 红包/转账详情共用唯一 QWQ 信息母结构；类型只负责业务内容，不建立第二套视觉层。 */
    #theme-modal-extra .qq-chat-commerce-detail {
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
      padding: 4px 8px 2px;
      text-align: center;
    }

    #theme-modal-extra .qq-chat-commerce-detail-head {
      min-height: 0;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      background: transparent;
      color: var(--ui-text);
    }

    #theme-modal-extra .qq-chat-commerce-detail-avatar {
      width: 46px;
      height: 46px;
      border: 1px solid var(--ui-line);
      border-radius: 50%;
      display: grid;
      place-items: center;
      overflow: hidden;
      background: var(--ui-surface-secondary);
      background-size: cover;
      background-position: center;
      color: var(--ui-text);
      font-size: 16px;
      font-weight: 650;
      box-shadow: none;
    }

    #theme-modal-extra .qq-chat-commerce-detail-avatar.has-image {
      color: transparent;
    }

    #theme-modal-extra .qq-chat-commerce-detail-sender {
      margin-top: 8px;
      color: var(--ui-text);
      font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      line-height: 1.35;
    }

    #theme-modal-extra .qq-chat-commerce-detail-description {
      margin-top: 5px;
      max-width: 230px;
      color: var(--ui-muted);
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.45;
      overflow-wrap: anywhere;
    }

    #theme-modal-extra .qq-chat-commerce-detail-amount {
      margin-top: 13px;
      color: var(--ui-text);
      font-size: 31px;
      font-weight: 700;
      line-height: 1.1;
      font-variant-numeric: tabular-nums;
      letter-spacing: -.02em;
    }

    #theme-modal-extra .qq-chat-commerce-detail-amount.is-concealed {
      color: var(--ui-muted);
      font-size: calc(11px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 500;
      letter-spacing: 0;
    }

    #theme-modal-extra .qq-chat-commerce-detail-status {
      margin-top: 8px;
      color: var(--ui-muted);
      font-size: calc(10.5px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.4;
    }




    #page-qq-app .qq-chat-more-icon {
      aspect-ratio: 1 / 1;
      display: grid;
      place-items: center;
      background: #ffffff;
      color: inherit;
      box-shadow: 0 1px 3px rgba(0, 0, 0, .035);
      width: 54px;
      height: 54px;
      border-radius: 13px;
    }
    #page-qq-app .qq-chat-more-icon svg {
      display: block;
      color: currentColor;
      width: 22px;
      height: 22px;
    }

    /* 线下页本身就是线下聊天；设置只通过全局底部抽屉承载。 */
    #page-qq-app .qq-offline-longform-view {
      position: relative;
      width: min(100%, var(--global-page-max-width));
      height: 100%;
      min-width: 0;
      min-height: 0;
      margin: 0 auto;
      display: none;
      grid-template-rows: auto minmax(0, 1fr) auto;
      background: var(--parent-bg);
      color: var(--parent-text);
      overflow: hidden;
    }

    #page-qq-app[data-qq-view="offline-longform"] > :not(.qq-offline-longform-view):not(.qq-auth-view) {
      display: none;
    }

    #page-qq-app[data-qq-view="offline-longform"] > .qq-offline-longform-view {
      display: grid;
    }

    #page-qq-app .qq-offline-longform-header {
      position: relative;
      z-index: 4;
      margin-bottom: 0;
      padding-bottom: 18px;
      border-bottom: 0;
      background: transparent;
      isolation: isolate;
    }

    #page-qq-app .qq-offline-longform-header::before {
      content: "";
      position: absolute;
      z-index: -2;
      inset: calc(-1 * var(--global-page-start)) calc(-1 * var(--global-page-inline)) -58px;
      pointer-events: none;
      background:
        linear-gradient(180deg,
          var(--parent-bg) 0%,
          var(--parent-bg) 42%,
          color-mix(in srgb, var(--parent-bg) 92%, transparent) 62%,
          color-mix(in srgb, var(--parent-bg) 74%, transparent) 74%,
          color-mix(in srgb, var(--parent-bg) 36%, transparent) 88%,
          transparent 100%);
    }

    #page-qq-app .qq-offline-longform-header::after {
      content: "";
      position: absolute;
      z-index: -1;
      left: calc(-1 * var(--global-page-inline));
      right: calc(-1 * var(--global-page-inline));
      bottom: -28px;
      height: 56px;
      pointer-events: none;
      background: linear-gradient(180deg,
        color-mix(in srgb, var(--parent-bg) 52%, transparent) 0%,
        color-mix(in srgb, var(--parent-bg) 14%, transparent) 58%,
        transparent 100%);
      filter: blur(10px);
      opacity: .88;
    }

    #page-qq-app .qq-offline-longform-header .global-page-title,
    #page-qq-app .qq-offline-settings-action {
      color: var(--parent-text);
    }

    #page-qq-app .qq-offline-settings-action {
      display: grid;
      place-items: center;
    }

    #page-qq-app .qq-offline-settings-action .qq-offline-settings-fa {
      width: 18px;
      height: 18px;
      display: grid;
      place-items: center;
      font-size: 18px;
      line-height: 1;
      transform: none;
    }

    #page-qq-app .qq-offline-chat-stream {
      min-width: 0;
      min-height: 0;
      overflow-y: auto;
      overscroll-behavior: contain;
      padding: 4px var(--global-page-inline) 28px;
      background: var(--parent-bg);
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-time {
      display: none !important;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-offline-longform {
      width: 100%;
      max-width: 100%;
      margin: 0 0 24px;
      align-items: start;
    }

    /* 线下正文统一使用独立杂志式消息骨架；用户与角色只做左右镜像，不再出现“用户没应用”。 */
    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-offline-longform.has-offline-magazine-head {
      grid-template-columns: minmax(0, 1fr);
      grid-template-areas:
        "thinking"
        "bubble";
      row-gap: 8px;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-offline-longform.has-offline-magazine-head .qq-chat-thinking {
      width: max-content;
      max-width: min(58vw, 220px);
      margin-left: 0;
      justify-self: start;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-outgoing.is-offline-longform.has-offline-magazine-head .qq-chat-thinking {
      justify-self: end;
      margin-left: auto;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-offline-longform.has-offline-magazine-head .qq-chat-offline-longform {
      grid-area: bubble;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      padding: 0;
      display: grid;
      gap: 10px;
      color: var(--parent-text);
      user-select: text;
      -webkit-user-select: text;
    }

    #page-qq-app .qq-chat-offline-magazine-head {
      position: relative;
      min-width: 0;
      min-height: 78px;
      padding: 10px 16px 10px 10px;
      border-radius: 999px 28px 28px 999px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(140px, 46%);
      align-items: center;
      gap: 10px;
      overflow: hidden;
      color: #111214;
      background: linear-gradient(90deg,
        rgba(255, 255, 255, .985) 0%,
        rgba(255, 255, 255, .97) 47%,
        rgba(255, 255, 255, .8) 68%,
        rgba(255, 255, 255, .38) 85%,
        rgba(255, 255, 255, 0) 100%);
    }

    #page-qq-app .qq-chat-offline-magazine-head::after {
      content: "";
      position: absolute;
      inset: auto 0 -18px 0;
      height: 28px;
      pointer-events: none;
      background: linear-gradient(180deg,
        color-mix(in srgb, #ffffff 10%, transparent) 0%,
        transparent 100%);
      filter: blur(8px);
      opacity: .9;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-head {
      padding: 10px 10px 10px 16px;
      border-radius: 28px 999px 999px 28px;
      grid-template-columns: minmax(140px, 46%) minmax(0, 1fr);
      background: linear-gradient(270deg,
        rgba(255, 255, 255, .985) 0%,
        rgba(255, 255, 255, .97) 47%,
        rgba(255, 255, 255, .8) 68%,
        rgba(255, 255, 255, .38) 85%,
        rgba(255, 255, 255, 0) 100%);
    }

    #page-qq-app .qq-chat-offline-magazine-identity {
      min-width: 0;
      display: grid;
      grid-template-columns: 52px minmax(0, 1fr);
      align-items: center;
      gap: 10px;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-identity {
      grid-template-columns: minmax(0, 1fr) 52px;
      text-align: right;
    }

    #page-qq-app .qq-chat-offline-magazine-avatar.qq-chat-avatar {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      grid-area: auto;
      box-shadow: 0 0 0 1px rgba(17, 18, 20, .04);
    }

    #page-qq-app .qq-chat-offline-magazine-copy {
      min-width: 0;
      display: grid;
      gap: 5px;
      align-content: center;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-copy {
      justify-items: end;
    }

    #page-qq-app .qq-chat-offline-magazine-name-line {
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 6px;
    }

    #page-qq-app .qq-chat-offline-magazine-name {
      min-width: 0;
      overflow: hidden;
      color: #111214;
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 690;
      line-height: 1.15;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #page-qq-app .qq-chat-offline-magazine-follow {
      min-width: 34px;
      height: 18px;
      padding: 0 8px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex: 0 0 auto;
      background: #111214;
      color: #ffffff;
      font-size: calc(8px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
      line-height: 1;
      letter-spacing: .02em;
    }

    #page-qq-app .qq-chat-offline-magazine-status {
      min-width: 0;
      display: inline-flex;
      align-items: center;
      gap: 5px;
      color: rgba(17, 18, 20, .48);
      font-size: calc(9px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 450;
      line-height: 1.1;
      white-space: nowrap;
    }

    #page-qq-app .qq-chat-offline-magazine-status > span {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    #page-qq-app .qq-chat-offline-magazine-status-time {
      flex: 0 0 auto;
      opacity: .9;
      letter-spacing: .015em;
    }

    #page-qq-app .qq-chat-offline-magazine-status-arrow {
      width: auto;
      height: auto;
      flex: 0 0 auto;
      font-size: 7px;
      line-height: 1;
      opacity: .68;
    }

    #page-qq-app .qq-chat-offline-magazine-ornament {
      min-width: 0;
      min-height: 62px;
      position: relative;
      display: block;
      align-self: stretch;
      color: rgba(17, 18, 20, .68);
      pointer-events: none;
      user-select: none;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament {
      order: -1;
    }

    #page-qq-app .qq-chat-offline-magazine-ornament-line {
      position: absolute;
      display: flex;
      align-items: flex-end;
      white-space: nowrap;
      font-family: var(--user-font-family);
    }

    #page-qq-app .qq-chat-offline-magazine-ornament-upper {
      top: 2px;
      right: -7px;
      transform: rotate(-4deg);
      transform-origin: right center;
    }

    #page-qq-app .qq-chat-offline-magazine-ornament-lower {
      right: -2px;
      bottom: 0;
      transform: rotate(1.8deg);
      transform-origin: right center;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper {
      right: auto;
      left: -6px;
      transform: rotate(4deg);
      transform-origin: left center;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower {
      right: auto;
      left: -1px;
      transform: rotate(-1.8deg);
      transform-origin: left center;
    }

    #page-qq-app .qq-chat-offline-magazine-ornament-char {
      position: relative;
      display: inline-block;
      font-style: normal;
      line-height: .92;
    }

    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(1) { font-size: calc(17px * var(--user-font-size-scale) * var(--display-scale)); opacity: .38; filter: blur(1.2px); transform: translate(0px, 4px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(2) { font-size: calc(23px * var(--user-font-size-scale) * var(--display-scale)); opacity: .8; transform: translate(-2px, -1px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(3) { font-size: calc(14px * var(--user-font-size-scale) * var(--display-scale)); opacity: .46; filter: blur(.5px); transform: translate(-4px, 5px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(4) { font-size: calc(21px * var(--user-font-size-scale) * var(--display-scale)); opacity: .66; transform: translate(-6px, 0px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(5) { font-size: calc(15px * var(--user-font-size-scale) * var(--display-scale)); opacity: .52; transform: translate(-8px, 6px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(6) { font-size: calc(24px * var(--user-font-size-scale) * var(--display-scale)); opacity: .9; filter: blur(.22px); transform: translate(-10px, -2px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(7) { font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale)); opacity: .34; filter: blur(1.4px); transform: translate(-12px, 7px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(8) { font-size: calc(22px * var(--user-font-size-scale) * var(--display-scale)); opacity: .72; transform: translate(-14px, 0px); }

    #page-qq-app .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(1) { font-size: calc(25px * var(--user-font-size-scale) * var(--display-scale)); opacity: .82; transform: translate(0px, 0px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(2) { font-size: calc(17px * var(--user-font-size-scale) * var(--display-scale)); opacity: .42; filter: blur(1px); transform: translate(-1px, 5px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(3) { font-size: calc(27px * var(--user-font-size-scale) * var(--display-scale)); opacity: .96; transform: translate(-3px, -1px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(4) { font-size: calc(16px * var(--user-font-size-scale) * var(--display-scale)); opacity: .4; filter: blur(.7px); transform: translate(-5px, 5px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(5) { font-size: calc(24px * var(--user-font-size-scale) * var(--display-scale)); opacity: .74; transform: translate(-8px, -1px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(6) { font-size: calc(18px * var(--user-font-size-scale) * var(--display-scale)); opacity: .5; filter: blur(.55px); transform: translate(-10px, 4px); }
    #page-qq-app .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(7) { font-size: calc(30px * var(--user-font-size-scale) * var(--display-scale)); opacity: .98; transform: translate(-13px, -3px); }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(1),
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(1) { transform: translate(0px, 2px); }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(2) { transform: translate(3px, -1px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(3) { transform: translate(6px, 5px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(4) { transform: translate(9px, 0px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(5) { transform: translate(11px, 6px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(6) { transform: translate(13px, -2px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(7) { transform: translate(15px, 7px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-upper .qq-chat-offline-magazine-ornament-char:nth-child(8) { transform: translate(17px, 0px); }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(2) { transform: translate(2px, 5px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(3) { transform: translate(4px, -1px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(4) { transform: translate(6px, 5px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(5) { transform: translate(9px, -1px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(6) { transform: translate(11px, 4px); }
    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-ornament-lower .qq-chat-offline-magazine-ornament-char:nth-child(7) { transform: translate(14px, -3px); }

    #page-qq-app .qq-chat-offline-body {
      min-width: 0;
      padding: 15px 16px 16px;
      border: 1px solid color-mix(in srgb, var(--ui-line) 76%, transparent);
      border-radius: 18px;
      background: var(--ui-surface);
      color: var(--parent-text);
      box-shadow: 0 8px 24px rgba(0, 0, 0, .025);
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.82;
      letter-spacing: .004em;
      overflow-wrap: anywhere;
    }

    #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-body {
      margin-left: auto;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-offline-original,
    #page-qq-app .qq-offline-chat-stream .qq-chat-offline-translation {
      gap: 12px;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-offline-dialogue {
      color: var(--parent-text);
      font-weight: 500;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-offline-narration {
      color: var(--ui-muted);
      font-style: italic;
      font-weight: 400;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-offline-translation {
      border-top-color: var(--ui-line);
    }

    /* 线下用户消息沿用同一应用结构，仅做左右反转。 */
    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-outgoing.is-offline-longform {
      grid-template-columns: minmax(0, 1fr);
      grid-template-areas:
        "thinking"
        "bubble";
      column-gap: 0;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-outgoing.is-offline-longform .qq-chat-avatar {
      display: none;
    }

    #page-qq-app .qq-offline-chat-stream .qq-chat-message.is-outgoing.is-offline-longform .qq-chat-offline-longform {
      grid-area: bubble;
      width: 100%;
      max-width: 100%;
      padding: 0;
      justify-self: end;
      color: var(--parent-text);
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.82;
      letter-spacing: .004em;
    }

    #page-qq-app .qq-offline-composer {
      min-width: 0;
      padding: 10px var(--global-page-inline) max(10px, env(safe-area-inset-bottom));
      display: grid;
      grid-template-columns: minmax(0, 1fr) 42px 56px;
      align-items: end;
      gap: 8px;
      border-top: 1px solid var(--ui-line);
      background: var(--parent-bg);
    }

    #page-qq-app .qq-offline-input {
      width: 100%;
      min-width: 0;
      min-height: 42px;
      max-height: 132px;
      height: 42px;
      padding: 10px 12px;
      border: 1px solid var(--ui-line);
      border-radius: 14px;
      outline: 0;
      resize: none;
      overflow-y: hidden;
      background: var(--ui-surface-secondary);
      color: var(--parent-text);
      font: inherit;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.55;
      box-shadow: none;
    }

    #page-qq-app .qq-offline-input::placeholder {
      color: var(--ui-muted);
    }

    #page-qq-app .qq-offline-ai-request,
    #page-qq-app .qq-offline-send {
      height: 42px;
      border: 0;
      outline: 0;
      font: inherit;
      cursor: pointer;
    }

    #page-qq-app .qq-offline-ai-request {
      width: 42px;
      padding: 9px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      background: transparent;
      color: var(--parent-text);
    }

    #page-qq-app .qq-offline-ai-request .qq-lucide-svg,
    #page-qq-app .qq-offline-ai-request .qq-chat-ai-state-icon {
      width: 22px;
      height: 22px;
    }

    #page-qq-app .qq-offline-send {
      min-width: 56px;
      padding: 0 12px;
      border-radius: 14px;
      background: var(--parent-text);
      color: var(--parent-bg);
      font-size: calc(12px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 650;
    }

    #page-qq-app .qq-offline-ai-request:disabled,
    #page-qq-app .qq-offline-send:disabled {
      opacity: .35;
      cursor: default;
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-group {
      width: 100%;
      overflow: hidden;
      border-top: 1px solid var(--ui-line);
      border-bottom: 1px solid var(--ui-line);
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-row {
      min-height: 64px;
      padding: 10px 2px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) 78px;
      align-items: center;
      gap: 18px;
      color: var(--ui-text);
      border-bottom: 1px solid var(--ui-line);
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-row:last-child {
      border-bottom: 0;
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-copy {
      min-width: 0;
      display: grid;
      gap: 4px;
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-copy strong {
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      font-weight: 600;
      line-height: 1.25;
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-copy span {
      color: var(--ui-muted);
      font-size: calc(10px * var(--user-font-size-scale) * var(--display-scale));
      line-height: 1.35;
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-number {
      width: 78px;
      height: 36px;
      padding: 0;
      border: 0;
      outline: 0;
      appearance: textfield;
      background: transparent;
      color: var(--ui-text);
      text-align: right;
      font: inherit;
      font-size: calc(13px * var(--user-font-size-scale) * var(--display-scale));
      font-variant-numeric: tabular-nums;
    }

    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-number::-webkit-inner-spin-button,
    #theme-global-drawer[data-type="qq-offline-settings"] .qq-offline-drawer-number::-webkit-outer-spin-button {
      appearance: none;
      margin: 0;
    }

    :root[data-theme-texture="dark"] #page-qq-app {
      --qq-header: #171B24;
      --qq-bg: var(--ui-panel);
      --qq-surface: var(--ui-surface);
      --qq-soft: var(--ui-surface-secondary);
      --qq-text: var(--ui-text);
      --qq-line: var(--ui-line);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-side-hero {
      background-color: #87939a;
      background-image: none;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-top-action,
    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-like,
    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-marker-icon,
    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-feature-icon,
    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-tag,
    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-action {
      color: var(--qq-text);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-tag,
    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-action {
      border-color: var(--qq-line);
      background: var(--qq-surface);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-profile-action.is-primary {
      border-color: var(--qq-blue);
      background: var(--qq-blue);
      color: #fff;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-search-box input::placeholder,
    :root[data-theme-texture="dark"] #page-qq-app .qq-account-copy small,
    :root[data-theme-texture="dark"] #page-qq-app .qq-contact-item-meta,
    :root[data-theme-texture="dark"] #page-qq-app .qq-contact-placeholder,
    :root[data-theme-texture="dark"] #page-qq-app .qq-group-count {
      color: var(--ui-muted);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-account-link {
      box-shadow: 0 0 0 2px var(--qq-surface);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-header-avatar,
    :root[data-theme-texture="dark"] #page-qq-app .qq-post-avatar,
    :root[data-theme-texture="dark"] #page-qq-app .qq-side-avatar,
    :root[data-theme-texture="dark"] #page-qq-app .qq-follow {
      background: var(--qq-soft);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-side-interaction-divider {
      background: var(--qq-line);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-view,
    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-layout,
    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-stream {
      background: #171719;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-topbar,
    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-composer {
      background: #1d1d20;
      color: #f4f4f5;
      border-color: #2a2a2e;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-top-action {
      color: #f4f4f5;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-input,
    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-message.is-incoming .qq-chat-bubble {
      background: #27272b;
      color: #f5f5f6;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-longform {
      color: #f1f1f2;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-magazine-head {
      color: #f4f4f5;
      background: linear-gradient(90deg,
        rgba(39, 39, 43, .98) 0%,
        rgba(39, 39, 43, .96) 48%,
        rgba(39, 39, 43, .78) 69%,
        rgba(39, 39, 43, .34) 86%,
        rgba(39, 39, 43, 0) 100%);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-magazine-head::after {
      background: linear-gradient(180deg,
        color-mix(in srgb, #27272b 18%, transparent) 0%,
        transparent 100%);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-message.is-outgoing .qq-chat-offline-magazine-head {
      background: linear-gradient(270deg,
        rgba(39, 39, 43, .98) 0%,
        rgba(39, 39, 43, .96) 48%,
        rgba(39, 39, 43, .78) 69%,
        rgba(39, 39, 43, .34) 86%,
        rgba(39, 39, 43, 0) 100%);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-magazine-name {
      color: #f4f4f5;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-magazine-status,
    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-magazine-ornament {
      color: rgba(244, 244, 245, .56);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-body {
      border-color: rgba(255, 255, 255, .08);
      background: #27272b;
      box-shadow: 0 8px 24px rgba(0, 0, 0, .10);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-dialogue {
      color: #f1f1f2;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-narration {
      color: rgba(238, 238, 240, .54);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-offline-translation {
      border-top-color: rgba(255, 255, 255, .10);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-more-item {
      color: #bdbdc2;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-more-icon {
      background: #27272b;
      color: inherit;
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-more-dot {
      background: rgba(255, 255, 255, .20);
    }

    :root[data-theme-texture="dark"] #page-qq-app .qq-chat-more-dot.is-active {
      background: rgba(255, 255, 255, .70);
    }

/* QQ 账号门禁：认证数据仍绑定现有面具；此处只维护 QQ 风格认证页，不向全局样式外溢。 */
#page-qq-app .qq-auth-view {
  --qq-auth-bg: #f0f0f2;
  --qq-auth-text: #181818;
  --qq-auth-muted: #9a9a9f;
  --qq-auth-placeholder: #cfd0d3;
  --qq-auth-link: #2c5f9f;
  --qq-auth-blue: #0099ff;
  --qq-auth-blue-disabled: #78c5f9;
  --qq-auth-line: #d7d7da;
  --qq-auth-inline: clamp(34px, 10.75vw, 48px);
  position: relative;
  grid-area: 1 / 1;
  z-index: 80;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: var(--qq-auth-bg);
  color: var(--qq-auth-text);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

#page-qq-app[data-qq-auth="ready"] .qq-auth-view {
  display: none;
}

#page-qq-app:not([data-qq-auth="ready"]) > .qq-main-view,
#page-qq-app:not([data-qq-auth="ready"]) > .qq-side-view,
#page-qq-app:not([data-qq-auth="ready"]) > .qq-profile-view,
#page-qq-app:not([data-qq-auth="ready"]) > .qq-chat-view,
#page-qq-app:not([data-qq-auth="ready"]) > .qq-self-profile-view,
#page-qq-app:not([data-qq-auth="ready"]) > .qq-wallet-view,
#page-qq-app:not([data-qq-auth="ready"]) > .qq-offline-longform-view,
#page-qq-app:not([data-qq-auth="ready"]) > .qq-image-viewer-page {
  display: none;
}

#page-qq-app .qq-auth-shell {
  width: 100%;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-rows: 54px minmax(0, 1fr);
  background: var(--qq-auth-bg);
}

#page-qq-app .qq-auth-topbar {
  position: relative;
  z-index: 2;
  min-height: 54px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--qq-auth-bg);
}

#page-qq-app .qq-auth-back,
#page-qq-app .qq-auth-help {
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--qq-auth-text);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

#page-qq-app .qq-auth-back {
  width: 42px;
  height: 42px;
  margin-left: -10px;
  padding: 0;
  display: grid;
  place-items: center;
}

#page-qq-app .qq-auth-back .qq-auth-lucide {
  width: 27px;
  height: 27px;
  stroke-width: 2.15;
}

#page-qq-app .qq-auth-help {
  min-width: 48px;
  min-height: 42px;
  margin-right: -7px;
  padding: 0 5px;
  font-size: 14px;
  font-weight: 400;
  line-height: 42px;
  text-align: right;
}

#page-qq-app[data-qq-auth="register"] .qq-auth-help {
  visibility: hidden;
  pointer-events: none;
}

#page-qq-app .qq-auth-stage {
  position: relative;
  min-height: 0;
  overflow: hidden;
}

#page-qq-app .qq-auth-loading {
  min-height: 100%;
  padding: 0 24px 9vh;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: #8f9095;
  font-size: 12px;
}

#page-qq-app .qq-auth-loading[hidden],
#page-qq-app .qq-auth-panel[hidden],
#page-qq-app .qq-auth-form[hidden],
#page-qq-app .qq-auth-secondary[hidden],
#page-qq-app [data-qq-auth-register-step][hidden] {
  display: none;
}

#page-qq-app .qq-auth-loading-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--qq-auth-blue);
  box-shadow: 0 0 0 5px rgba(0, 153, 255, .09);
  animation: qq-auth-pulse 1.15s ease-in-out infinite;
}

@keyframes qq-auth-pulse {
  0%, 100% { transform: scale(.82); opacity: .55; }
  50% { transform: scale(1); opacity: 1; }
}

#page-qq-app .qq-auth-panel {
  width: min(100%, 520px);
  height: 100%;
  min-height: 0;
  margin: 0 auto;
  padding-inline: var(--qq-auth-inline);
  padding-bottom: max(22px, env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
  background: transparent;
}

#page-qq-app[data-qq-auth="login"] .qq-auth-panel {
  padding-top: clamp(58px, 8.2vh, 76px);
}

#page-qq-app[data-qq-auth="register"] .qq-auth-panel {
  padding-top: clamp(22px, 3.6vh, 36px);
}

#page-qq-app .qq-auth-heading {
  flex: 0 0 auto;
  text-align: center;
}

#page-qq-app .qq-auth-heading h1 {
  margin: 0;
  color: var(--qq-auth-text);
  font-size: 26px;
  font-weight: 500;
  line-height: 1.18;
  letter-spacing: -.02em;
}

#page-qq-app .qq-auth-heading p {
  margin: 0;
}

#page-qq-app .qq-auth-form {
  min-height: 0;
  flex: 1;
}

#page-qq-app .qq-auth-login-form,
#page-qq-app .qq-auth-register-form {
  display: flex;
  flex-direction: column;
}

#page-qq-app .qq-auth-login-main {
  padding-top: clamp(48px, 6.4vh, 58px);
}

#page-qq-app .qq-auth-input-stack {
  display: grid;
  gap: 18px;
}

#page-qq-app .qq-auth-input-stack input {
  width: 100%;
  height: 54px;
  padding: 0 18px;
  border: 0;
  border-radius: 16px;
  outline: 0;
  background: #fff;
  box-shadow: 0 6px 18px rgba(31, 36, 44, .025);
  color: var(--qq-auth-text);
  text-align: center;
  font-family: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 54px;
  caret-color: var(--qq-auth-blue);
}

#page-qq-app .qq-auth-input-stack input::placeholder {
  color: var(--qq-auth-placeholder);
  opacity: 1;
}

#page-qq-app .qq-auth-text-action {
  width: max-content;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--qq-auth-link);
  font-family: inherit;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
  cursor: pointer;
}

#page-qq-app .qq-auth-login-main > .qq-auth-text-action {
  margin-top: 22px;
}

#page-qq-app .qq-auth-message {
  min-height: 18px;
  margin: 7px 2px 3px;
  color: #df3d43;
  font-size: 11px;
  line-height: 1.45;
  text-align: left;
}

#page-qq-app .qq-auth-message:empty {
  visibility: hidden;
}

#page-qq-app .qq-auth-message[data-tone="info"] {
  color: #7c7e83;
}

#page-qq-app .qq-auth-primary,
#page-qq-app .qq-auth-secondary {
  width: 100%;
  min-height: 50px;
  border: 0;
  border-radius: 14px;
  font-family: inherit;
  cursor: pointer;
}

#page-qq-app .qq-auth-primary {
  background: var(--qq-auth-blue);
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  box-shadow: none;
}

#page-qq-app .qq-auth-primary:disabled {
  background: var(--qq-auth-blue-disabled);
  color: rgba(255, 255, 255, .72);
  cursor: default;
}

#page-qq-app .qq-auth-secondary {
  margin-top: 10px;
  background: #fff;
  color: var(--qq-auth-text);
  font-size: 13px;
}

#page-qq-app .qq-auth-agreement {
  margin-top: 24px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 7px;
  color: #8c8d92;
}

#page-qq-app .qq-auth-agreement-check {
  position: relative;
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
  margin-top: 1px;
  cursor: pointer;
}

#page-qq-app .qq-auth-agreement-check input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

#page-qq-app .qq-auth-checkmark {
  width: 15px;
  height: 15px;
  border: 1px solid #d4d5d8;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: transparent;
  background: transparent;
  pointer-events: none;
}

#page-qq-app .qq-auth-checkmark .qq-auth-lucide {
  width: 9px;
  height: 9px;
  stroke-width: 2.4;
}

#page-qq-app .qq-auth-agreement-check input:checked + .qq-auth-checkmark {
  border-color: var(--qq-auth-blue);
  background: var(--qq-auth-blue);
  color: #fff;
}

#page-qq-app .qq-auth-agreement p {
  max-width: 305px;
  margin: 0;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.55;
}

#page-qq-app .qq-auth-agreement-link {
  display: inline;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--qq-auth-link);
  font: inherit;
  line-height: inherit;
  cursor: pointer;
}

#page-qq-app .qq-auth-bottom-actions {
  margin-top: auto;
  padding: 0 0 clamp(0px, 1.2vh, 10px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

#page-qq-app .qq-auth-bottom-action,
#page-qq-app .qq-auth-register-other {
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--qq-auth-text);
  font-family: inherit;
  cursor: pointer;
}

#page-qq-app .qq-auth-bottom-action {
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 12px;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.35;
}

#page-qq-app .qq-auth-action-icon {
  width: 48px;
  height: 48px;
  border: 1px solid var(--qq-auth-line);
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--qq-auth-text);
  background: transparent;
}

#page-qq-app .qq-auth-action-icon .qq-auth-lucide {
  width: 21px;
  height: 21px;
  stroke-width: 2;
}

#page-qq-app .qq-auth-register-main {
  flex: 1;
  min-height: 0;
}

#page-qq-app .qq-auth-register-phone-step {
  padding-top: clamp(112px, 15.4vh, 142px);
}

#page-qq-app .qq-auth-register-number {
  color: var(--qq-auth-text);
  text-align: center;
  font-size: clamp(34px, 9.8vw, 42px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: .005em;
  white-space: nowrap;
}

#page-qq-app .qq-auth-register-carrier {
  margin: 25px 0 clamp(46px, 6.3vh, 58px);
  color: #98999e;
  text-align: center;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
}

#page-qq-app .qq-auth-register-agreement {
  margin-top: clamp(62px, 8vh, 76px);
}

#page-qq-app .qq-auth-register-agreement p {
  max-width: 306px;
}

#page-qq-app .qq-auth-register-password-step {
  padding-top: clamp(88px, 12vh, 112px);
}

#page-qq-app .qq-auth-register-password-copy {
  margin: 0 0 27px;
  color: #85868b;
  text-align: center;
  font-size: 12px;
  line-height: 1.5;
}

#page-qq-app .qq-auth-register-password-copy strong {
  color: var(--qq-auth-text);
  font-weight: 600;
}

#page-qq-app .qq-auth-register-password-step .qq-auth-message {
  margin-top: 11px;
}

#page-qq-app .qq-auth-register-step-back {
  margin: 17px auto 0;
  display: block;
}

#page-qq-app .qq-auth-register-other {
  margin: auto auto clamp(0px, 1.3vh, 10px);
  display: grid;
  justify-items: center;
  gap: 12px;
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.35;
}

#page-qq-app [data-qq-auth-register-form][data-step="password"] .qq-auth-register-other {
  display: none;
}

@media (max-width: 360px) {
  #page-qq-app .qq-auth-view {
    --qq-auth-inline: 30px;
  }

  #page-qq-app .qq-auth-heading h1 {
    font-size: 25px;
  }

  #page-qq-app .qq-auth-register-number {
    font-size: 33px;
  }
}

@media (max-height: 720px) {
  #page-qq-app[data-qq-auth="login"] .qq-auth-panel {
    padding-top: 42px;
  }

  #page-qq-app[data-qq-auth="register"] .qq-auth-panel {
    padding-top: 18px;
  }

  #page-qq-app .qq-auth-login-main {
    padding-top: 36px;
  }

  #page-qq-app .qq-auth-register-phone-step {
    padding-top: 68px;
  }

  #page-qq-app .qq-auth-register-carrier {
    margin-bottom: 35px;
  }

  #page-qq-app .qq-auth-register-agreement {
    margin-top: 38px;
  }

  #page-qq-app .qq-auth-register-password-step {
    padding-top: 58px;
  }
}

@media (prefers-reduced-motion: reduce) {
  #page-qq-app .qq-auth-loading-dot { animation: none; }
}