/* ==========================================
   ✦ INS 风格 · Y2K · 毛玻璃亚文化主题
   css/theme-ins.css
   ========================================== */

/* ===== 字体 ===== */
@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;500;700&display=swap');

/* ===== 主题变量 ===== */
[data-theme="ins"] {
    --ins-white: #FFFFFF;
    --ins-bg: #f0f0f3;
    --ins-bg-warm: #f5f4f2;
    --ins-grey-100: #fafafa;
    --ins-grey-200: #f0f0f0;
    --ins-grey-300: #e0e0e0;
    --ins-grey-400: #bdbdbd;
    --ins-grey-500: #9e9e9e;
    --ins-grey-600: #757575;
    --ins-grey-700: #616161;
    --ins-text: #2c2c2c;
    --ins-text-mid: #666666;
    --ins-text-light: #999999;
    --ins-text-pale: #c0c0c0;
    --ins-accent: #b0b0b0;

    --ins-font: 'Zen Kaku Gothic New', 'Helvetica Neue', Arial, sans-serif;

    --ins-glass: rgba(255, 255, 255, 0.40);
    --ins-glass-heavy: rgba(255, 255, 255, 0.58);
    --ins-glass-light: rgba(255, 255, 255, 0.28);
    --ins-glass-border: rgba(255, 255, 255, 0.55);
    --ins-glass-border-dark: rgba(200, 200, 200, 0.35);
    --ins-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
    --ins-shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.04);
    --ins-shadow-heavy: 0 12px 40px rgba(0, 0, 0, 0.08);
    --ins-blur: blur(20px) saturate(180%);
    --ins-blur-heavy: blur(28px) saturate(200%);
    --ins-radius-xl: 28px;
    --ins-radius-lg: 22px;
    --ins-radius-md: 16px;
    --ins-radius-sm: 12px;
    --ins-radius-full: 9999px;
}

/* ===== 全局字体覆盖 ===== */
[data-theme="ins"] * {
    font-family: var(--ins-font) !important;
}

/* ===== FA 图标字体恢复 ===== */
[data-theme="ins"] .fa,
[data-theme="ins"] .fas,
[data-theme="ins"] .far,
[data-theme="ins"] .fab,
[data-theme="ins"] .fal,
[data-theme="ins"] .fad,
[data-theme="ins"] .fa-solid,
[data-theme="ins"] .fa-regular,
[data-theme="ins"] .fa-brands,
[data-theme="ins"] i[class*="fa-"] {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
    font-size: 16px !important;
    display: inline-block !important;
    color: var(--ins-text-mid) !important;
}
[data-theme="ins"] .fab,
[data-theme="ins"] .fa-brands {
    font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands", FontAwesome !important;
}
[data-theme="ins"] .fa,
[data-theme="ins"] .fas,
[data-theme="ins"] .fa-solid { font-weight: 900 !important; }
[data-theme="ins"] .far,
[data-theme="ins"] .fa-regular { font-weight: 400 !important; }
[data-theme="ins"] .fa::before,
[data-theme="ins"] .fas::before,
[data-theme="ins"] .far::before,
[data-theme="ins"] .fab::before,
[data-theme="ins"] i[class*="fa-"]::before {
    font-family: inherit !important;
    font-weight: inherit !important;
}
[data-theme="ins"] i[class*="fa-"]::after {
    content: none !important;
    display: none !important;
}

/* ===== 布局切换 ===== */
.ins-layout { display: none !important; }
[data-theme="ins"] .default-layout { display: none !important; }
[data-theme="ins"] .angel-layout { display: none !important; }
[data-theme="ins"] .tenshi-layout { display: none !important; }
[data-theme="ins"] .angel-nav-arrows { display: none !important; }
[data-theme="ins"] .angel-page-dots { display: none !important; }
[data-theme="ins"] .tenshi-nav-arrows { display: none !important; }
[data-theme="ins"] .tenshi-page-dots { display: none !important; }
[data-theme="ins"] .default-page-dots { display: none !important; }

[data-theme="ins"] .ins-layout {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    height: 100%;
    position: relative;
}

/* ===== 主容器 ===== */
[data-theme="ins"] .phone-container {
    background-color: var(--ins-bg) !important;
}
[data-theme="ins"] .home-screen {
    padding: 0 !important;
    gap: 0 !important;
    overflow: hidden !important;
    background: var(--ins-bg) !important;
    position: relative;
}

/* 微弱纹理叠层 */
[data-theme="ins"] .home-screen::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 25% 15%, rgba(255,255,255,0.5) 0%, transparent 55%),
        radial-gradient(ellipse at 80% 80%, rgba(230,230,235,0.3) 0%, transparent 50%);
    pointer-events: none;
    z-index: 0;
}

/* ===== 状态栏 ===== */
[data-theme="ins"] .status-bar {
    color: var(--ins-text-light) !important;
    font-weight: 500 !important;
}
[data-theme="ins"] .battery-capsule {
    background-color: transparent !important;
    border: 1px solid var(--ins-grey-300) !important;
    color: var(--ins-text-light) !important;
    border-radius: var(--ins-radius-full) !important;
}

/* ==========================================
   滑动容器 & 页面
   ========================================== */
[data-theme="ins"] .ins-slider {
    display: flex;
    width: 200%;
    height: 100%;
    transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform;
    transform: translateX(0%);
}
[data-theme="ins"] .ins-slider.page-1 {
    transform: translateX(-50%);
}
[data-theme="ins"] .ins-page {
    width: 50%;
    height: 100%;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    padding: 12px 16px;
    padding-top: calc(50px + env(safe-area-inset-top, 0px) + 6px);
    padding-bottom: calc(100px + env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    gap: 12px;
    position: relative;
    z-index: 1;
}

/* ===== 页面指示器 ===== */
[data-theme="ins"] .ins-page-dots {
    position: absolute;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 50;
}
[data-theme="ins"] .ins-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background-color: var(--ins-grey-400);
    transition: all 0.3s ease;
    cursor: pointer;
    opacity: 0.4;
}
[data-theme="ins"] .ins-dot.active {
    width: 20px;
    border-radius: 3px;
    background-color: var(--ins-text-mid);
    opacity: 0.8;
}

/* ===== 翻页箭头 (仅桌面) ===== */
[data-theme="ins"] .ins-nav-arrows { display: none; }
@media (hover: hover) and (pointer: fine) {
    [data-theme="ins"] .ins-nav-arrows {
        display: block;
        position: absolute;
        top: 0; left: 0; right: 0; bottom: 0;
        pointer-events: none;
        z-index: 60;
    }
    [data-theme="ins"] .ins-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 34px; height: 34px;
        border: 1px solid var(--ins-glass-border);
        background: var(--ins-glass-heavy);
        backdrop-filter: var(--ins-blur);
        -webkit-backdrop-filter: var(--ins-blur);
        border-radius: 50%;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all 0.2s ease;
        opacity: 0.5;
        pointer-events: auto;
    }
    [data-theme="ins"] .ins-arrow:hover {
        opacity: 1;
        background: var(--ins-white);
        box-shadow: var(--ins-shadow);
    }
    [data-theme="ins"] .ins-arrow span {
        font-size: 18px;
        color: var(--ins-text-mid);
        line-height: 1;
    }
    [data-theme="ins"] .ins-arrow-left { left: 6px; }
    [data-theme="ins"] .ins-arrow-right { right: 6px; }
    [data-theme="ins"] .ins-arrow.disabled {
        opacity: 0.12;
        pointer-events: none;
    }
}

/* ==========================================
   组件通用基础样式
   ========================================== */
[data-theme="ins"] .ins-component-slot {
    position: relative;
    border-radius: var(--ins-radius-xl);
    overflow: visible;
    transition: transform 0.15s ease;
}
[data-theme="ins"] .ins-component-slot:active {
    transform: scale(0.985);
}

/* 双击提示光晕 */
[data-theme="ins"] .ins-component-slot::after {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: calc(var(--ins-radius-xl) + 2px);
    border: 2px dashed transparent;
    pointer-events: none;
    transition: border-color 0.3s ease;
    z-index: 10;
}
[data-theme="ins"] .ins-component-slot.ins-slot-hint::after {
    border-color: rgba(150,150,150,0.35);
    animation: ins-hint-pulse 1.5s ease-in-out infinite;
}

@keyframes ins-hint-pulse {
    0%, 100% { border-color: rgba(150,150,150,0.15); }
    50% { border-color: rgba(150,150,150,0.45); }
}

/* ===== 毛玻璃卡片基类 ===== */
[data-theme="ins"] .ins-glass-card {
    background: var(--ins-glass-heavy);
    backdrop-filter: var(--ins-blur);
    -webkit-backdrop-filter: var(--ins-blur);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-xl);
    box-shadow: var(--ins-shadow);
    overflow: hidden;
    position: relative;
}

/* 珠光高光叠层 */
[data-theme="ins"] .ins-glass-card::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        145deg,
        rgba(255,255,255,0.35) 0%,
        transparent 40%,
        rgba(255,255,255,0.08) 100%
    );
    pointer-events: none;
    z-index: 1;
    border-radius: inherit;
}

/* ==========================================
   P1 — 双人互动音乐播放大组件
   ========================================== */
[data-theme="ins"] .ins-p1 {
    padding: 18px 14px 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    min-height: 220px;
}
/* 双人区域 */
[data-theme="ins"] .ins-p1-duo {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    position: relative;
    padding-top: 28px;
}
[data-theme="ins"] .ins-p1-person {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    position: relative;
}
/* 气泡 */
[data-theme="ins"] .ins-p1-bubble {
    position: absolute;
    top: -24px;
    background: var(--ins-white);
    border: 1px solid var(--ins-glass-border-dark);
    border-radius: 10px;
    padding: 3px 8px;
    font-size: 9px;
    color: var(--ins-text-light);
    white-space: nowrap;
    box-shadow: var(--ins-shadow-soft);
}
[data-theme="ins"] .ins-p1-bubble::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 50%;
    transform: translateX(-50%) rotate(45deg);
    width: 7px; height: 7px;
    background: var(--ins-white);
    border-right: 1px solid var(--ins-glass-border-dark);
    border-bottom: 1px solid var(--ins-glass-border-dark);
}
/* 头像 */
[data-theme="ins"] .ins-p1-avatar {
    width: 60px; height: 60px;
    border-radius: 50%;
    border: 2.5px solid var(--ins-grey-300);
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    cursor: pointer;
    transition: opacity 0.2s;
}
[data-theme="ins"] .ins-p1-avatar:hover { opacity: 0.8; }
/* 连接弧线 */
[data-theme="ins"] .ins-p1-arc {
    position: absolute;
    top: 55px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 30px;
    pointer-events: none;
}
[data-theme="ins"] .ins-p1-arc path {
    fill: none;
    stroke: var(--ins-grey-400);
    stroke-width: 1.5;
    stroke-dasharray: 4 3;
}
/* 心情文案 */
[data-theme="ins"] .ins-p1-mood {
    font-size: 10px;
    color: var(--ins-text-pale);
    text-align: center;
    letter-spacing: 0.5px;
    padding: 0 10px;
}
/* 音乐控制区 */
[data-theme="ins"] .ins-p1-player {
    width: 92%;
    background: var(--ins-glass);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-lg);
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
[data-theme="ins"] .ins-p1-song {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
[data-theme="ins"] .ins-p1-song-name {
    font-size: 12px;
    font-weight: 500;
    color: var(--ins-text);
}
/* 均衡器条 */
[data-theme="ins"] .ins-p1-eq {
    display: flex;
    align-items: flex-end;
    gap: 2px;
    height: 14px;
}
[data-theme="ins"] .ins-p1-eq span {
    width: 3px;
    background: var(--ins-text-light);
    border-radius: 1px;
    animation: ins-eq-bounce 0.8s ease-in-out infinite alternate;
}
[data-theme="ins"] .ins-p1-eq span:nth-child(1) { height: 6px; animation-delay: 0s; }
[data-theme="ins"] .ins-p1-eq span:nth-child(2) { height: 10px; animation-delay: 0.15s; }
[data-theme="ins"] .ins-p1-eq span:nth-child(3) { height: 4px; animation-delay: 0.3s; }
[data-theme="ins"] .ins-p1-eq span:nth-child(4) { height: 12px; animation-delay: 0.1s; }
[data-theme="ins"] .ins-p1-eq span:nth-child(5) { height: 7px; animation-delay: 0.25s; }

@keyframes ins-eq-bounce {
    0% { transform: scaleY(0.4); }
    100% { transform: scaleY(1); }
}

[data-theme="ins"] .ins-p1-deco-line {
    text-align: center;
    font-size: 10px;
    color: var(--ins-text-pale);
    letter-spacing: 1px;
}
/* 进度条 */
[data-theme="ins"] .ins-progress {
    display: flex;
    align-items: center;
    gap: 6px;
}
[data-theme="ins"] .ins-progress-time {
    font-size: 9px;
    color: var(--ins-text-pale);
    min-width: 24px;
}
[data-theme="ins"] .ins-progress-track {
    flex: 1;
    height: 2px;
    background: var(--ins-grey-300);
    border-radius: 2px;
    position: relative;
}
[data-theme="ins"] .ins-progress-fill {
    width: 38%;
    height: 100%;
    background: var(--ins-text-light);
    border-radius: 2px;
}
/* 控制按钮 */
[data-theme="ins"] .ins-p1-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2px 8px;
}
[data-theme="ins"] .ins-p1-ctrl-btn {
    width: 28px; height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--ins-text-mid);
    font-size: 13px;
    border-radius: 50%;
    transition: background 0.15s;
}
[data-theme="ins"] .ins-p1-ctrl-btn:hover {
    background: rgba(0,0,0,0.04);
}

/* ==========================================
   P2 — 拼图式氛围音乐大组件
   ========================================== */
[data-theme="ins"] .ins-p2 {
    display: flex;
    flex-direction: column;
    min-height: 220px;
}
[data-theme="ins"] .ins-p2-collage {
    display: flex;
    height: 150px;
    gap: 2px;
    overflow: hidden;
    border-radius: var(--ins-radius-xl) var(--ins-radius-xl) 0 0;
    position: relative;
}
[data-theme="ins"] .ins-p2-img {
    flex: 1;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    cursor: pointer;
    transition: opacity 0.2s;
}
[data-theme="ins"] .ins-p2-img:hover { opacity: 0.85; }
/* 悬浮APP图标 */
[data-theme="ins"] .ins-p2-float-icon {
    position: absolute;
    bottom: -20px;
    right: 20px;
    width: 48px; height: 48px;
    border-radius: var(--ins-radius-md);
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    border: 3px solid var(--ins-white);
    box-shadow: var(--ins-shadow-heavy);
    z-index: 5;
    cursor: pointer;
}
[data-theme="ins"] .ins-p2-bottom {
    padding: 24px 14px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
[data-theme="ins"] .ins-p2-send {
    text-align: right;
    font-size: 10px;
    color: var(--ins-text-pale);
}
[data-theme="ins"] .ins-p2-lyric {
    font-size: 11px;
    color: var(--ins-text-light);
    text-align: center;
    letter-spacing: 0.5px;
}

/* ==========================================
   P3 — 环绕式按钮快捷中组件
   ========================================== */
[data-theme="ins"] .ins-p3 {
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 120px;
}
[data-theme="ins"] .ins-p3-side {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
[data-theme="ins"] .ins-p3-btn {
    padding: 8px 14px;
    background: var(--ins-glass);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-full);
    font-size: 10px;
    color: var(--ins-text-light);
    text-align: center;
    cursor: pointer;
    transition: all 0.15s;
    letter-spacing: 0.5px;
}
[data-theme="ins"] .ins-p3-btn:hover {
    background: var(--ins-glass-heavy);
    color: var(--ins-text-mid);
}
[data-theme="ins"] .ins-p3-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}
[data-theme="ins"] .ins-p3-avatar {
    width: 70px; height: 70px;
    border-radius: 50%;
    border: 2px solid var(--ins-grey-300);
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    cursor: pointer;
}
[data-theme="ins"] .ins-p3-deco {
    font-size: 9px;
    color: var(--ins-text-pale);
    letter-spacing: 2px;
}

/* ==========================================
   P4 — 仪表盘状态中组件
   ========================================== */
[data-theme="ins"] .ins-p4 {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 120px;
}
[data-theme="ins"] .ins-p4-top {
    display: flex;
    gap: 10px;
    justify-content: center;
}
[data-theme="ins"] .ins-p4-battery {
    padding: 10px 16px;
    background: var(--ins-glass);
    backdrop-filter: blur(12px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-full);
    text-align: center;
}
[data-theme="ins"] .ins-p4-battery-num {
    font-size: 20px;
    font-weight: 700;
    color: var(--ins-text);
}
[data-theme="ins"] .ins-p4-battery-label {
    font-size: 9px;
    color: var(--ins-text-pale);
}
[data-theme="ins"] .ins-p4-ring-wrap {
    width: 52px; height: 52px;
    background: var(--ins-glass);
    backdrop-filter: blur(12px);
    border: 1px solid var(--ins-glass-border);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
[data-theme="ins"] .ins-p4-ring {
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 3px solid var(--ins-grey-300);
    border-top-color: var(--ins-text-mid);
    animation: ins-ring-spin 2s linear infinite;
}
@keyframes ins-ring-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
/* 底部信息条 */
[data-theme="ins"] .ins-p4-info {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: var(--ins-glass);
    backdrop-filter: blur(12px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-full);
}
[data-theme="ins"] .ins-p4-info-avatar {
    width: 32px; height: 32px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}
[data-theme="ins"] .ins-p4-info-text {
    flex: 1;
    min-width: 0;
}
[data-theme="ins"] .ins-p4-info-title {
    font-size: 10px;
    color: var(--ins-text);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
[data-theme="ins"] .ins-p4-info-sub {
    font-size: 9px;
    color: var(--ins-text-pale);
}
[data-theme="ins"] .ins-p4-info-right {
    text-align: right;
    flex-shrink: 0;
}
[data-theme="ins"] .ins-p4-info-time {
    font-size: 18px;
    font-weight: 700;
    color: var(--ins-text);
}
[data-theme="ins"] .ins-p4-info-steps {
    font-size: 9px;
    color: var(--ins-text-pale);
}

/* ==========================================
   P5 — 宽版胶囊音乐中组件
   ========================================== */
[data-theme="ins"] .ins-p5 {
    padding: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    min-height: 130px;
    position: relative;
    overflow: visible !important;
}
[data-theme="ins"] .ins-p5-big-avatar {
    width: 80px; height: 80px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    border: 3px solid var(--ins-white);
    box-shadow: var(--ins-shadow);
    position: relative;
    z-index: 3;
    margin-bottom: -20px;
    cursor: pointer;
}
[data-theme="ins"] .ins-p5-capsule {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    padding-left: 6px;
    background: var(--ins-glass);
    backdrop-filter: blur(14px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-full);
    position: relative;
    z-index: 2;
}
[data-theme="ins"] .ins-p5-sm-avatar {
    width: 32px; height: 32px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
    border: 1.5px solid var(--ins-glass-border);
}
[data-theme="ins"] .ins-p5-mini-controls {
    display: flex;
    gap: 4px;
    flex-shrink: 0;
}
[data-theme="ins"] .ins-p5-mini-btn {
    width: 22px; height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: var(--ins-text-mid);
    cursor: pointer;
}
[data-theme="ins"] .ins-p5-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
[data-theme="ins"] .ins-p5-notes {
    font-size: 8px;
    color: var(--ins-text-pale);
    letter-spacing: 1px;
}
[data-theme="ins"] .ins-p5-song-name {
    font-size: 11px;
    font-weight: 500;
    color: var(--ins-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
[data-theme="ins"] .ins-p5-artist {
    font-size: 8px;
    color: var(--ins-text-pale);
}

/* ==========================================
   P6 — 对角气泡对话中组件
   ========================================== */
[data-theme="ins"] .ins-p6 {
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 110px;
}
[data-theme="ins"] .ins-p6-bubble {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: rgba(255,255,255,0.45);
    backdrop-filter: blur(10px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-full);
}
[data-theme="ins"] .ins-p6-bubble.ins-p6-right {
    flex-direction: row-reverse;
    margin-left: 20px;
}
[data-theme="ins"] .ins-p6-bubble.ins-p6-left {
    margin-right: 20px;
}
[data-theme="ins"] .ins-p6-avatar {
    width: 30px; height: 30px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}
[data-theme="ins"] .ins-p6-text {
    font-size: 10px;
    color: var(--ins-text-light);
    letter-spacing: 0.5px;
    flex: 1;
}

/* ==========================================
   P7 — 多层标签小组件
   ========================================== */
[data-theme="ins"] .ins-p7 {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 100px;
}
[data-theme="ins"] .ins-p7-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4px;
}
[data-theme="ins"] .ins-p7-title-left,
[data-theme="ins"] .ins-p7-title-right {
    font-size: 12px;
    color: var(--ins-text-light);
}
[data-theme="ins"] .ins-p7-title-center {
    font-size: 13px;
    font-weight: 500;
    color: var(--ins-text);
    letter-spacing: 1px;
}
[data-theme="ins"] .ins-p7-capsule {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    background: rgba(255,255,255,0.45);
    backdrop-filter: blur(8px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-full);
}
[data-theme="ins"] .ins-p7-capsule-avatar {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}
[data-theme="ins"] .ins-p7-capsule-text {
    flex: 1;
    font-size: 9px;
    color: var(--ins-text-light);
    letter-spacing: 0.5px;
}

/* ==========================================
   P8 — 日历清单小组件
   ========================================== */
[data-theme="ins"] .ins-p8 {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 100px;
}
[data-theme="ins"] .ins-p8-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 8px;
}
[data-theme="ins"] .ins-p8-avatar {
    width: 28px; height: 28px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
}
[data-theme="ins"] .ins-p8-date-num {
    font-size: 32px;
    font-weight: 700;
    color: var(--ins-grey-400);
    line-height: 1;
}
[data-theme="ins"] .ins-p8-list {
    display: flex;
    flex-direction: column;
}
[data-theme="ins"] .ins-p8-item {
    padding: 7px 4px;
    border-bottom: 1px dashed rgba(200,200,200,0.3);
    text-align: center;
    font-size: 10px;
    color: var(--ins-text-light);
    letter-spacing: 0.5px;
}
[data-theme="ins"] .ins-p8-item:last-child {
    border-bottom: none;
}

/* ==========================================
   P9 — 波浪边框图片小组件
   ========================================== */
[data-theme="ins"] .ins-p9 {
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-height: 100px;
}
[data-theme="ins"] .ins-p9-title {
    font-size: 10px;
    color: var(--ins-text-light);
    letter-spacing: 1px;
}
[data-theme="ins"] .ins-p9-frame {
    width: 80px; height: 80px;
    border-radius: 42% 58% 65% 35% / 45% 55% 45% 55%;
    overflow: hidden;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    border: 2px solid var(--ins-glass-border);
    cursor: pointer;
    transition: opacity 0.2s;
}
[data-theme="ins"] .ins-p9-frame:hover { opacity: 0.85; }

/* ==========================================
   P10 — 正方形音乐小组件
   ========================================== */
[data-theme="ins"] .ins-p10 {
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    min-height: 100px;
    position: relative;
    overflow: visible !important;
}
[data-theme="ins"] .ins-p10-avatar {
    width: 65px; height: 65px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    background-size: cover;
    background-position: center;
    border: 2.5px solid var(--ins-white);
    box-shadow: var(--ins-shadow-soft);
    z-index: 3;
    margin-bottom: -14px;
    cursor: pointer;
}
[data-theme="ins"] .ins-p10-bar {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 8px;
    background: var(--ins-glass);
    backdrop-filter: blur(10px);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-full);
    z-index: 2;
}
[data-theme="ins"] .ins-p10-bar-avatar {
    width: 18px; height: 18px;
    border-radius: 50%;
    background: var(--ins-grey-200);
    flex-shrink: 0;
}
[data-theme="ins"] .ins-p10-bar-info {
    flex: 1;
    min-width: 0;
}
[data-theme="ins"] .ins-p10-bar-name {
    font-size: 9px;
    color: var(--ins-text);
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
[data-theme="ins"] .ins-p10-bar-artist {
    font-size: 7px;
    color: var(--ins-text-pale);
}

/* ==========================================
   组件替换面板
   ========================================== */
[data-theme="ins"] .ins-swap-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.35);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 99990;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    animation: ins-fade-in 0.2s ease;
}
@keyframes ins-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
[data-theme="ins"] .ins-swap-panel {
    width: 100%;
    max-width: 420px;
    max-height: auto;
    background: var(--ins-white);
    border-radius: var(--ins-radius-xl) var(--ins-radius-xl) 0 0;
    box-shadow: 0 -10px 40px rgba(0,0,0,0.12);
    overflow-y: auto;
    padding: 20px 16px;
    animation: ins-slide-up 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes ins-slide-up {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}
[data-theme="ins"] .ins-swap-handle {
    width: 36px; height: 4px;
    background: var(--ins-grey-300);
    border-radius: 2px;
    margin: 0 auto 14px;
}
[data-theme="ins"] .ins-swap-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--ins-text);
    text-align: center;
    margin-bottom: 16px;
}
[data-theme="ins"] .ins-swap-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
[data-theme="ins"] .ins-swap-option {
    background: var(--ins-grey-100);
    border: 2px solid transparent;
    border-radius: var(--ins-radius-lg);
    padding: 12px;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
}
[data-theme="ins"] .ins-swap-option:hover {
    border-color: var(--ins-grey-400);
    box-shadow: var(--ins-shadow-soft);
}
[data-theme="ins"] .ins-swap-option.active {
    border-color: var(--ins-text);
    background: var(--ins-white);
}
[data-theme="ins"] .ins-swap-option-preview {
    width: 100%;
    height: 60px;
    background: var(--ins-grey-200);
    border-radius: var(--ins-radius-sm);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: var(--ins-text-pale);
}
[data-theme="ins"] .ins-swap-option-name {
    font-size: 11px;
    color: var(--ins-text-mid);
    font-weight: 500;
}

/* ==========================================
   APP图标 (主题内)
   ========================================== */
[data-theme="ins"] .ins-app-icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    transition: transform 0.15s ease;
}
[data-theme="ins"] .ins-app-icon:active {
    transform: scale(0.88);
}
[data-theme="ins"] .ins-icon-box {
    width: 50px; height: 50px;
    background: var(--ins-glass-heavy);
    backdrop-filter: var(--ins-blur);
    -webkit-backdrop-filter: var(--ins-blur);
    border: 1px solid var(--ins-glass-border);
    border-radius: var(--ins-radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--ins-shadow-soft);
    overflow: hidden;
    background-size: cover;
    background-position: center;
    transition: all 0.2s;
}
[data-theme="ins"] .ins-app-icon:hover .ins-icon-box {
    box-shadow: var(--ins-shadow);
    border-color: var(--ins-grey-400);
}
[data-theme="ins"] .ins-icon-box i {
    font-size: 19px !important;
    color: var(--ins-text-mid) !important;
}
[data-theme="ins"] .ins-icon-box[style*="background-image"] i {
    display: none !important;
}
[data-theme="ins"] .ins-icon-label {
    font-size: 9px;
    color: var(--ins-text-light);
    text-align: center;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

/* 图标网格 */
[data-theme="ins"] .ins-icon-grid-2x2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}
[data-theme="ins"] .ins-icon-grid-4x1 {
    display: flex;
    justify-content: space-around;
    gap: 8px;
}

/* 行布局 */
[data-theme="ins"] .ins-row {
    display: flex;
    gap: 12px;
    align-items: stretch;
}
[data-theme="ins"] .ins-row-col {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* 日期时间头 */
[data-theme="ins"] .ins-header-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 6px 4px;
    opacity: 0.5;
}
[data-theme="ins"] .ins-date,
[data-theme="ins"] .ins-clock {
    font-size: 11px;
    color: var(--ins-text-light);
    letter-spacing: 1.5px;
    font-weight: 500;
}

/* 散落装饰 */
[data-theme="ins"] .ins-deco {
    position: absolute;
    color: var(--ins-grey-400);
    pointer-events: none;
    z-index: 2;
    font-size: 14px;
    opacity: 0.3;
}
[data-theme="ins"] .ins-deco.id-1 { top: 10%; left: 8%; animation: ins-float 6s ease-in-out infinite; }
[data-theme="ins"] .ins-deco.id-2 { top: 25%; right: 5%; animation: ins-float 5s ease-in-out infinite 0.5s; }
[data-theme="ins"] .ins-deco.id-3 { bottom: 40%; left: 4%; animation: ins-float 7s ease-in-out infinite 1s; }
[data-theme="ins"] .ins-deco.id-4 { bottom: 20%; right: 8%; animation: ins-float 5.5s ease-in-out infinite 0.8s; }

@keyframes ins-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
}

/* ==========================================
   DOCK 栏
   ========================================== */
[data-theme="ins"] .dock-bar {
    background: var(--ins-glass-heavy) !important;
    backdrop-filter: var(--ins-blur-heavy) !important;
    -webkit-backdrop-filter: var(--ins-blur-heavy) !important;
    border: none !important;
    border-top: 0.5px solid rgba(200,200,200,0.3) !important;
    border-radius: var(--ins-radius-xl) !important;
    box-shadow: 0 -2px 20px rgba(0,0,0,0.04) !important;
    height: 68px !important;
    padding: 0 16px !important;
}
[data-theme="ins"] .dock-bar .app-icon-inner {
    background: rgba(245,245,247,0.5) !important;
    border: 1px solid var(--ins-glass-border) !important;
    box-shadow: var(--ins-shadow-soft) !important;
    width: 48px !important;
    height: 48px !important;
    border-radius: 14px !important;
    overflow: hidden !important;
}
[data-theme="ins"] .dock-bar .app-icon-inner img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 14px !important;
    filter: saturate(0.9) brightness(1.02) !important;
}
[data-theme="ins"] .dock-bar .app-icon:hover .app-icon-inner img {
    filter: saturate(1) brightness(1) !important;
}
[data-theme="ins"] .dock-bar .app-icon span { display: none !important; }
[data-theme="ins"] .dock-bar .app-icon-inner::before,
[data-theme="ins"] .dock-bar .app-icon-inner::after {
    content: none !important;
    display: none !important;
}

/* ==========================================
   全局状态栏重叠修复
   ========================================== */
.app-container > .qq-header,
.app-container > .t-header,
.app-container > .ig-header,
.app-container > .ff-header,
.app-container > .forum-header,
.app-container > .shop-header,
.app-container > .wb-header,
.app-container > .cp-nav,
.cp-page > .cp-nav,
.pc-page > .pc-header,
.pc-subpage > .pc-header {
    padding-top: calc(env(safe-area-inset-top, 0px) + 10px) !important;
    min-height: calc(44px + env(safe-area-inset-top, 0px) + 10px) !important;
    box-sizing: border-box !important;
}

/* 生日APP的返回按钮 */
.bday-back-btn {
    top: calc(env(safe-area-inset-top, 0px) + 12px) !important;
}

/* ==========================================
   全部 APP 内页面适配（灰白玻璃化）
   ========================================== */
/* 通用头部 */
[data-theme="ins"] .qq-header,
[data-theme="ins"] .t-header,
[data-theme="ins"] .ig-header,
[data-theme="ins"] .ff-header,
[data-theme="ins"] .forum-header,
[data-theme="ins"] .shop-header,
[data-theme="ins"] .sub-header,
[data-theme="ins"] .wb-header,
[data-theme="ins"] .cp-nav {
    background: rgba(255,255,255,0.88) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid var(--ins-grey-300) !important;
    box-shadow: none !important;
}
[data-theme="ins"] .qq-title,
[data-theme="ins"] .t-logo,
[data-theme="ins"] .ig-logo,
[data-theme="ins"] .ff-title,
[data-theme="ins"] .forum-title,
[data-theme="ins"] .sub-title,
[data-theme="ins"] .wb-title,
[data-theme="ins"] .cp-nav-title {
    color: var(--ins-text) !important;
    font-weight: 600 !important;
}

/* 通用底部导航 */
[data-theme="ins"] .qq-tab-bar,
[data-theme="ins"] .t-nav-bar,
[data-theme="ins"] .ig-nav-bar,
[data-theme="ins"] .ff-nav,
[data-theme="ins"] .forum-nav,
[data-theme="ins"] .shop-nav {
    background: rgba(255,255,255,0.88) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-top: 1px solid var(--ins-grey-300) !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    width: 100% !important;
    left: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;

}
[data-theme="ins"] .qq-tab-item,
[data-theme="ins"] .t-nav-item,
[data-theme="ins"] .ig-nav-item,
[data-theme="ins"] .ff-nav-item,
[data-theme="ins"] .forum-nav-item,
[data-theme="ins"] .shop-nav-item {
    color: var(--ins-text-pale) !important;
}
[data-theme="ins"] .qq-tab-item.active,
[data-theme="ins"] .t-nav-item.active,
[data-theme="ins"] .ig-nav-item.active,
[data-theme="ins"] .ff-nav-item.active,
[data-theme="ins"] .forum-nav-item.active,
[data-theme="ins"] .shop-nav-item.active {
    color: var(--ins-text) !important;
}
[data-theme="ins"] .qq-tab-item i,
[data-theme="ins"] .t-nav-item i,
[data-theme="ins"] .ig-nav-item i,
[data-theme="ins"] .ff-nav-item i,
[data-theme="ins"] .forum-nav-item i,
[data-theme="ins"] .shop-nav-item i {
    color: inherit !important;
}

/* 通用内容区 */
[data-theme="ins"] .qq-content,
[data-theme="ins"] .t-content,
[data-theme="ins"] .ig-content,
[data-theme="ins"] .ff-content,
[data-theme="ins"] .forum-content,
[data-theme="ins"] .shop-content,
[data-theme="ins"] .wb-content,
[data-theme="ins"] .sub-content {
    background: var(--ins-bg) !important;
}

/* 通用卡片 */
[data-theme="ins"] .chat-item,
[data-theme="ins"] .contact-item,
[data-theme="ins"] .tweet-item,
[data-theme="ins"] .ig-post,
[data-theme="ins"] .ff-card,
[data-theme="ins"] .forum-post,
[data-theme="ins"] .shop-item,
[data-theme="ins"] .wb-book-item,
[data-theme="ins"] .moments-item {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: var(--ins-radius-md) !important;
    margin: 8px 12px !important;
    box-shadow: var(--ins-shadow-soft) !important;
}

/* 头像 */
[data-theme="ins"] .chat-avatar,
[data-theme="ins"] .contact-avatar,
[data-theme="ins"] .msg-avatar,
[data-theme="ins"] .tweet-avatar,
[data-theme="ins"] .ig-avatar-small,
[data-theme="ins"] .ig-profile-avatar,
[data-theme="ins"] .ff-card-avatar,
[data-theme="ins"] .t-avatar-small,
[data-theme="ins"] .t-drawer-avatar,
[data-theme="ins"] .me-avatar-large,
[data-theme="ins"] .moments-avatar,
[data-theme="ins"] .qq-avatar-small {
    border: 1.5px solid var(--ins-grey-300) !important;
    border-radius: 50% !important;
}

/* 文字颜色 */
[data-theme="ins"] .chat-name,
[data-theme="ins"] .contact-name,
[data-theme="ins"] .tweet-name,
[data-theme="ins"] .ig-username,
[data-theme="ins"] .ff-card-title,
[data-theme="ins"] .forum-post-title,
[data-theme="ins"] .moment-name,
[data-theme="ins"] .ig-profile-name,
[data-theme="ins"] .t-drawer-name,
[data-theme="ins"] .me-info h2,
[data-theme="ins"] .wb-book-name {
    color: var(--ins-text) !important;
}
[data-theme="ins"] .chat-msg,
[data-theme="ins"] .chat-time,
[data-theme="ins"] .tweet-handle,
[data-theme="ins"] .tweet-time,
[data-theme="ins"] .ig-time,
[data-theme="ins"] .ff-card-preview,
[data-theme="ins"] .forum-post-meta,
[data-theme="ins"] .moment-time,
[data-theme="ins"] .me-info p,
[data-theme="ins"] .wb-book-count,
[data-theme="ins"] .t-drawer-handle,
[data-theme="ins"] .ig-stat-label {
    color: var(--ins-text-light) !important;
}
[data-theme="ins"] .tweet-text,
[data-theme="ins"] .ig-caption,
[data-theme="ins"] .moment-text,
[data-theme="ins"] .ig-likes,
[data-theme="ins"] .ig-stat-num {
    color: var(--ins-text) !important;
}

/* 聊天气泡 */
[data-theme="ins"] .message-row:not(.self) .msg-bubble {
    background: var(--ins-white) !important;
    color: var(--ins-text) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: 18px 18px 18px 4px !important;
}
[data-theme="ins"] .message-row.self .msg-bubble {
    background: var(--ins-grey-200) !important;
    color: var(--ins-text) !important;
    border: none !important;
    border-radius: 18px 18px 4px 18px !important;
}

/* 聊天输入区 */
[data-theme="ins"] .chat-input-area {
    background: var(--ins-white) !important;
    border-top: 1px solid var(--ins-grey-300) !important;
}
[data-theme="ins"] .chat-input-area input {
    background: var(--ins-bg) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: 20px !important;
    color: var(--ins-text) !important;
}
[data-theme="ins"] .chat-circle-btn.send,
[data-theme="ins"] .send-btn {
    background: var(--ins-text) !important;
    color: var(--ins-white) !important;
    border: none !important;
}

/* 按钮 */
[data-theme="ins"] .action-btn {
    background: var(--ins-text) !important;
    color: var(--ins-white) !important;
    border: none !important;
    border-radius: 20px !important;
}
[data-theme="ins"] .action-btn.secondary {
    background: var(--ins-white) !important;
    color: var(--ins-text) !important;
    border: 1px solid var(--ins-grey-300) !important;
}

/* 输入框 */
[data-theme="ins"] input,
[data-theme="ins"] textarea,
[data-theme="ins"] select {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: var(--ins-radius-sm) !important;
    color: var(--ins-text) !important;
}
[data-theme="ins"] input:focus,
[data-theme="ins"] textarea:focus {
    border-color: var(--ins-text-mid) !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(150,150,150,0.1) !important;
}

/* 弹窗 */
[data-theme="ins"] .modal {
    background: rgba(0,0,0,0.25) !important;
    backdrop-filter: blur(6px) !important;
}
[data-theme="ins"] .modal-content,
[data-theme="ins"] .custom-dialog {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: var(--ins-radius-xl) !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.12) !important;
}
[data-theme="ins"] .sub-page {
    background: var(--ins-white) !important;
}

/* 通知 */
[data-theme="ins"] .in-app-notification {
    background: rgba(255,255,255,0.92) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: 18px !important;
    color: var(--ins-text) !important;
    backdrop-filter: blur(12px) !important;
}

/* 情侣空间 */
[data-theme="ins"] #coupleApp,
[data-theme="ins"] .cp-page {
    background: var(--ins-bg) !important;
}
[data-theme="ins"] .cp-home-header {
    background: linear-gradient(135deg, var(--ins-grey-200) 0%, var(--ins-bg-warm) 100%) !important;
}
[data-theme="ins"] .cp-menu-card,
[data-theme="ins"] .cp-card,
[data-theme="ins"] .cp-note-card {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: 18px !important;
}

[data-theme="ins"] #chatWindow { background-color: var(--ins-bg) !important; }

[data-theme="ins"] .chat-messages { background-color: var(--ins-bg) !important; }


/* CW App */
[data-theme="ins"] .cw-app-container { background: var(--ins-white) !important; }
[data-theme="ins"] .cw-top-bar {
    background: rgba(255,255,255,0.92) !important;
    border-bottom: 1px solid var(--ins-grey-300) !important;
}
[data-theme="ins"] .cw-logo { color: var(--ins-text) !important; text-shadow: none !important; }
[data-theme="ins"] .cw-nav-bar {
    background: rgba(255,255,255,0.92) !important;
    border-top: 1px solid var(--ins-grey-300) !important;
}
[data-theme="ins"] .cw-nav-item { color: var(--ins-text-pale) !important; }
[data-theme="ins"] .cw-nav-item.active { color: var(--ins-text) !important; text-shadow: none !important; }

/* 悬浮球 */
[data-theme="ins"] #fb-menu {
    background: rgba(255,255,255,0.95) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important;
    backdrop-filter: blur(15px) !important;
}

/* 滚动条 */
[data-theme="ins"] ::-webkit-scrollbar { width: 3px !important; }
[data-theme="ins"] ::-webkit-scrollbar-track { background: transparent !important; }
[data-theme="ins"] ::-webkit-scrollbar-thumb {
    background: var(--ins-grey-400) !important;
    border-radius: 3px !important;
}

/* 主题预览缩略图 */
.theme-preview-ins { background: #f0f0f3; }
.theme-preview-ins .tp-header {
    background: rgba(255,255,255,0.7);
    border-bottom: 1px solid #e0e0e0;
}
.theme-preview-ins .tp-widget {
    background: rgba(255,255,255,0.4);
    border: 1px solid rgba(255,255,255,0.5);
    border-radius: 6px;
    backdrop-filter: blur(4px);
}
.theme-preview-ins .tp-icons span {
    background: rgba(255,255,255,0.5);
    border: 1px solid rgba(255,255,255,0.5);
}
.theme-preview-ins .tp-dock {
    background: rgba(255,255,255,0.5);
    border-top: 1px solid #e0e0e0;
}
/* ==========================================
   ★ BUG 修复区：壁纸透传补丁与发光效果
   ========================================== */
[data-theme="ins"] .home-screen {
    background: transparent !important; /* 解除主屏背景实色挡住壁纸 */
}

/* 并且给小组件内部双击提示的光晕增加明显的渐变方便长按反馈 */
@keyframes ins-held-glow {
    0% { box-shadow: 0 0 0 0 rgba(150, 150, 150, 0.4); }
    100% { box-shadow: 0 0 0 6px rgba(150, 150, 150, 0); }
}
[data-theme="ins"] .ins-held {
    animation: ins-held-glow 0.8s ease-out infinite;
}
/* ==========================================
   ★ BUG 修复区：聊天输入区按钮被挡住修复
   ========================================== */
[data-theme="ins"] .chat-input-area {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important; /* 强制按钮和输入框之间留出间距 */
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important; /* 抬高以防被全面屏底侧黑条挡住 */
    flex-wrap: nowrap !important; /* 保证所有元素死死锁在一排 */
    overflow: hidden !important;
    box-sizing: border-box !important;
}

[data-theme="ins"] .chat-input-area input {
    flex: 1 1 auto !important; /* 核心修复：让输入框老老实实自适应剩余宽度绝不越界 */
    min-width: 0 !important; /* 打破浏览器默认最小宽度防止撑爆父元素 */
    width: auto !important;
}

/* 保护所有输入区的按钮不被挤压变形或挤出屏幕 */
[data-theme="ins"] .chat-input-area button,
[data-theme="ins"] .chat-input-area .chat-circle-btn,
[data-theme="ins"] .chat-input-area .send-btn {
    flex-shrink: 0 !important; /* 身位锁定绝对不可压缩 */
}
/* ==========================================
   ✦ 聊天间距用户调节 (全主题通用)
   ========================================== */

:root {
    --chat-gap: 15px;
    --chat-padding: 15px;
}

.chat-messages {
    gap: var(--chat-gap) !important;
    padding: var(--chat-padding) !important;
}

/* ==========================================
   ✦ 间距滑块设置面板样式
   ========================================== */
.chat-gap-preview {
    background: #f5f5f5;
    border-radius: 12px;
    padding: 12px;
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    transition: gap 0.2s ease;
}

.cgp-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cgp-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #ddd;
    flex-shrink: 0;
}

.cgp-bubble {
    font-size: 10px;
    padding: 5px 10px;
    border-radius: 10px;
    line-height: 1.3;
}

.cgp-row.left .cgp-bubble {
    background: #fff;
    border: 1px solid #e0e0e0;
    color: #333;
}

.cgp-row.right {
    flex-direction: row-reverse;
}

.cgp-row.right .cgp-bubble {
    background: #e0e0e0;
    color: #333;
}

/* ==========================================
   INS 主题 · 微信风格气泡
   ========================================== */
[data-theme="ins"][data-bubble="wechat"] .chat-messages {
    background-color: #ededed !important;
}


/* 对方消息：白色气泡 */
[data-theme="ins"][data-bubble="wechat"] .message-row:not(.self) .msg-bubble {
    background: #fff !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 4px 8px 8px 8px !important;
    padding: 9px 13px !important;
    box-shadow: none !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
}

/* 自己消息：微信绿色气泡 */
[data-theme="ins"][data-bubble="wechat"] .message-row.self .msg-bubble {
    background: #95EC69 !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 8px 4px 8px 8px !important;
    padding: 9px 13px !important;
    box-shadow: none !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
}

/* 方形头像 */
[data-theme="ins"][data-bubble="wechat"] .msg-avatar {
    width: 40px !important;
    height: 40px !important;
    border-radius: 4px !important;
    border: none !important;
}

/* 隐藏昵称 */
[data-theme="ins"][data-bubble="wechat"] .msg-name {
    display: none !important;
}

/* 气泡与头像顶部对齐 */
[data-theme="ins"][data-bubble="wechat"] .msg-content {
    padding-top: 0 !important;
}

/* 日期标签隐藏（微信不在头像旁显示日期） */
[data-theme="ins"][data-bubble="wechat"] .msg-date {
    display: none !important;
}

/* 时间戳 */
[data-theme="ins"][data-bubble="wechat"] .msg-time {
    font-size: 9px !important;
    color: #b0b0b0 !important;
}

/* 聊天列表头像也方形化 */
[data-theme="ins"][data-bubble="wechat"] .chat-input-area {
    background: #f5f5f5 !important;
    border-top: 0.5px solid #d9d9d9 !important;
}

[data-theme="ins"][data-bubble="wechat"] .chat-input-area input {
    background: #fff !important;
    border: none !important;
    border-radius: 4px !important;
}


/* ==========================================
   INS 主题 · iMessage 风格气泡
   ========================================== */
[data-theme="ins"][data-bubble="imessage"] .chat-messages {
    background-color: #fff !important;
}


[data-theme="ins"][data-bubble="imessage"] .message-row:not(.self) .msg-bubble {
    background: #e9e9eb !important;
    color: #1a1a1a !important;
    border: none !important;
    border-radius: 20px 20px 20px 6px !important;
    padding: 10px 16px !important;
    box-shadow: none !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
}

[data-theme="ins"][data-bubble="imessage"] .message-row.self .msg-bubble {
    background: linear-gradient(135deg, #3a3a3a 0%, #1a1a1a 100%) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px 20px 6px 20px !important;
    padding: 10px 16px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-avatar {
    display: none !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-avatar-wrapper {
    display: none !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-content {
    max-width: 78% !important;
    padding-top: 0 !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-name {
    display: none !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-time {
    display: none !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-date {
    display: none !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-system {
    background: transparent !important;
    color: #8e8e93 !important;
    font-size: 11px !important;
    box-shadow: none !important;
    padding: 8px 0 !important;
}

[data-theme="ins"][data-bubble="imessage"] .msg-system::before {
    display: none !important;
}

[data-theme="ins"][data-bubble="imessage"] .message-row.self + .message-row.self .msg-bubble {
    border-radius: 20px 6px 6px 20px !important;
}

[data-theme="ins"][data-bubble="imessage"] .message-row:not(.self) + .message-row:not(.self) .msg-bubble {
    border-radius: 6px 20px 20px 6px !important;
}

[data-theme="ins"][data-bubble="imessage"] .chat-input-area {
    background: #f6f6f6 !important;
    border-top: 0.5px solid #d1d1d6 !important;
}

[data-theme="ins"][data-bubble="imessage"] .chat-input-area input {
    background: #fff !important;
    border: 1px solid #d1d1d6 !important;
    border-radius: 18px !important;
}

/* ==========================================
   INS 主题 · 电报 (Telegram) 风格气泡
   ========================================== */
[data-theme="ins"][data-bubble="telegram"] .chat-messages {
    background-color: #e6ebee !important;
}


/* ---- 对齐修复：隐藏头像旁日期和时间 ---- */
[data-theme="ins"][data-bubble="telegram"] .msg-date {
    display: none !important;
}

[data-theme="ins"][data-bubble="telegram"] .msg-time {
    display: none !important;
}

/* ---- 气泡与头像顶部齐平 ---- */
[data-theme="ins"][data-bubble="telegram"] .msg-content {
    padding-top: 0 !important;
    gap: 1px !important;
}

/* ---- 对方消息：白色气泡 + 左上尾巴 ---- */
[data-theme="ins"][data-bubble="telegram"] .message-row:not(.self) .msg-bubble {
    background: #fff !important;
    color: #222 !important;
    border: none !important;
    border-radius: 4px 18px 18px 18px !important;
    padding: 6px 12px 7px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
}

/* ---- 自己消息：Telegram 标志浅绿 + 右上尾巴 ---- */
[data-theme="ins"][data-bubble="telegram"] .message-row.self .msg-bubble {
    background: #EEFFDE !important;
    color: #222 !important;
    border: none !important;
    border-radius: 18px 4px 18px 18px !important;
    padding: 6px 12px 7px !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06) !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
}

/* ---- 头像：小圆形 贴底显示 ---- */
[data-theme="ins"][data-bubble="telegram"] .msg-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    border: none !important;
}

[data-theme="ins"][data-bubble="telegram"] .msg-avatar-wrapper {
    justify-content: flex-end !important;
    padding-bottom: 2px !important;
}

/* ---- 发送者名字（对方气泡内顶部） ---- */
[data-theme="ins"][data-bubble="telegram"] .msg-name {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #3a8ed2 !important;
    margin-bottom: 0 !important;
    margin-left: 2px !important;
}

/* 自己消息隐藏名字 */
[data-theme="ins"][data-bubble="telegram"] .message-row.self .msg-name {
    display: none !important;
}

/* ---- 连续同方向消息：隐藏头像 + 收尾巴 ---- */
[data-theme="ins"][data-bubble="telegram"] .message-row:not(.self) + .message-row:not(.self) .msg-avatar {
    visibility: hidden !important;
}

[data-theme="ins"][data-bubble="telegram"] .message-row:not(.self) + .message-row:not(.self) .msg-name {
    display: none !important;
}

[data-theme="ins"][data-bubble="telegram"] .message-row:not(.self) + .message-row:not(.self) .msg-bubble {
    border-radius: 18px 18px 18px 18px !important;
}

[data-theme="ins"][data-bubble="telegram"] .message-row.self + .message-row.self .msg-bubble {
    border-radius: 18px 18px 18px 18px !important;
}
[data-theme="ins"][data-bubble="telegram"] .message-row.self + .message-row.self .msg-avatar {
    visibility: hidden !important;
}

/* ---- 系统消息 ---- */
[data-theme="ins"][data-bubble="telegram"] .msg-system {
    background: rgba(0,0,0,0.12) !important;
    color: #fff !important;
    font-size: 12px !important;
    border-radius: 16px !important;
    padding: 4px 12px !important;
    box-shadow: none !important;
}

[data-theme="ins"][data-bubble="telegram"] .msg-system::before {
    display: none !important;
}

/* ---- 输入框 ---- */
[data-theme="ins"][data-bubble="telegram"] .chat-input-area {
    background: #fff !important;
    border-top: none !important;
    padding: 6px 8px !important;
    box-shadow: 0 -1px 4px rgba(0,0,0,0.06) !important;
}

[data-theme="ins"][data-bubble="telegram"] .chat-input-area input {
    background: #f4f4f4 !important;
    border: none !important;
    border-radius: 22px !important;
    padding: 10px 16px !important;
    font-size: 15px !important;
}


/* ==========================================
   气泡风格选择器卡片样式
   ========================================== */
.bubble-style-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 10px;
}

.bubble-style-option {
    background: #fafafa;
    border: 2.5px solid transparent;
    border-radius: 14px;
    padding: 12px 10px;
    cursor: pointer;
    transition: all 0.2s;
    text-align: center;
}

.bubble-style-option:hover {
    border-color: #ccc;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.bubble-style-option.active {
    border-color: #333;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0,0,0,0.1);
}

.bubble-style-preview {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px;
    background: #f0f0f0;
    border-radius: 8px;
    margin-bottom: 8px;
    min-height: 60px;
    justify-content: center;
}

.bsp-left, .bsp-right {
    font-size: 9px;
    padding: 4px 8px;
    border-radius: 10px;
    max-width: 75%;
    line-height: 1.3;
}

.bsp-left { align-self: flex-start; }
.bsp-right { align-self: flex-end; }

.bubble-style-option[data-bs="default"] .bsp-left {
    background: #fff; border: 1px solid #e0e0e0;
    border-radius: 14px 14px 14px 4px; color: #333;
}
.bubble-style-option[data-bs="default"] .bsp-right {
    background: #eee; border-radius: 14px 14px 4px 14px; color: #333;
}

.bubble-style-option[data-bs="wechat"] .bubble-style-preview { background: #ededed; }
.bubble-style-option[data-bs="wechat"] .bsp-left {
    background: #fff; border-radius: 4px 6px 6px 6px; color: #1a1a1a;
}

.bubble-style-option[data-bs="wechat"] .bsp-right {
    background: #95EC69; border-radius: 6px 4px 6px 6px; color: #1a1a1a;
}


.bubble-style-option[data-bs="imessage"] .bubble-style-preview { background: #fff; }
.bubble-style-option[data-bs="imessage"] .bsp-left {
    background: #e9e9eb; border-radius: 14px 14px 14px 4px; color: #1a1a1a;
}
.bubble-style-option[data-bs="imessage"] .bsp-right {
    background: linear-gradient(135deg, #3a3a3a, #1a1a1a);
    border-radius: 14px 14px 4px 14px; color: #fff;
}

.bubble-style-option[data-bs="telegram"] .bubble-style-preview { background: #e6ebee; }

.bubble-style-option[data-bs="telegram"] .bsp-left {
    background: #fff; border-radius: 4px 12px 12px 12px; color: #222;
    box-shadow: 0 0.5px 1px rgba(0,0,0,0.06);
}

.bubble-style-option[data-bs="telegram"] .bsp-right {
    background: #EEFFDE; border-radius: 12px 4px 12px 12px; color: #222;
    box-shadow: 0 0.5px 1px rgba(0,0,0,0.06);
}


.bubble-style-name {
    font-size: 12px; font-weight: 600; color: #333;
}

.bubble-style-desc {
    font-size: 10px; color: #999; margin-top: 2px;
}

.bubble-style-ins-only {
    display: inline-block; font-size: 9px; background: #333;
    color: #fff; padding: 2px 6px; border-radius: 4px;
    letter-spacing: 0.5px;
}
/* ==========================================
   工具面板全宽修复 - 消除左右白边
   插入位置：qq.css 文件最末尾
========================================== */

/* 让工具面板突破父容器 padding 占满全宽 */
.chat-tools-panel {
    margin-left: -15px !important;
    margin-right: -15px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    width: calc(100% + 30px) !important;
    box-sizing: border-box !important;
    gap: 16px 12px !important;
}

/* 工具图标尺寸放大不再被挤压 */
.chat-tools-panel .tool-icon {
    width: 58px !important;
    height: 58px !important;
    border-radius: 16px !important;
    font-size: 22px !important;
}

.chat-tools-panel .tool-name {
    font-size: 11px !important;
}

/* 手机端也同步修复 */
@media (max-width: 480px) {
    .chat-tools-panel {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 14px 10px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .chat-tools-panel .tool-icon {
        width: 52px !important;
        height: 52px !important;
        font-size: 20px !important;
        border-radius: 14px !important;
    }

    .chat-tools-panel .tool-name {
        font-size: 10px !important;
    }
}
/* ===== 聊天壁纸兼容修复 ===== */
/* #chatWindow 层：只设 background-color 作为无壁纸时的兜底色不干扰 JS 设置的 background-image */
[data-theme="ins"] #chatWindow { background-color: var(--ins-bg) !important; }
/* messages 层透明让壁纸从自身或父层透出 */
[data-theme="ins"] .chat-messages {
    background-color: transparent !important;
}

/* 微信气泡 */
[data-theme="ins"][data-bubble="wechat"] #chatWindow { background-color: #ededed !important; }
[data-theme="ins"][data-bubble="wechat"] .chat-messages {
    background-color: transparent !important;
}

/* iMessage气泡 */
[data-theme="ins"][data-bubble="imessage"] #chatWindow { background-color: #fff !important; }
[data-theme="ins"][data-bubble="imessage"] .chat-messages {
    background-color: transparent !important;
}

/* Telegram气泡 */
[data-theme="ins"][data-bubble="telegram"] #chatWindow { background-color: #e6ebee !important; }
[data-theme="ins"][data-bubble="telegram"] .chat-messages {
    background-color: transparent !important;
}
/* ============================================================
   老板专属补丁：CW App 全主题高对比度/清晰度修复
   说明：拯救被过度柔化的字体让动态、私信、名字像默认主题一样清晰锐利！
   【插入位置：请务必将此段代码粘贴到整个 CSS 文件的最末尾】
   ============================================================ */



/* 2. Ins (毛玻璃) 主题 - CW App 文字加深 */
[data-theme="ins"] .cw-app-container,
[data-theme="ins"] .cw-card-info,
[data-theme="ins"] .cw-post-content,
[data-theme="ins"] .cw-msg-wrapper.other .cw-msg-bubble,
[data-theme="ins"] .cw-me-bio {
    color: #333333 !important;
}
[data-theme="ins"] .cw-logo,
[data-theme="ins"] .cw-card-name,
[data-theme="ins"] .cw-username,
[data-theme="ins"] .cw-chat-title b,
[data-theme="ins"] .cw-me-name {
    color: #111111 !important;
    font-weight: 800 !important;
}
[data-theme="ins"] .cw-time,
[data-theme="ins"] .cw-chat-preview,
[data-theme="ins"] .cw-nav-item,
[data-theme="ins"] .cw-comments-preview {
    color: #666666 !important;
}
[data-theme="ins"] .cw-nav-item.active {
    color: #111111 !important;
    font-weight: 800 !important;
}



/* 4. 统一修复输入框看不清的问题 */
[data-theme="angelcore"] .cw-chat-input-bar input,
[data-theme="ins"] .cw-chat-input-bar input,
[data-theme="tenshi"] .cw-chat-input-bar input {
    color: #111111 !important;
    font-weight: 500 !important;
}
[data-theme="angelcore"] .cw-chat-input-bar input::placeholder,
[data-theme="ins"] .cw-chat-input-bar input::placeholder,
[data-theme="tenshi"] .cw-chat-input-bar input::placeholder {
    color: #999999 !important;
    font-weight: 400 !important;
}
/* ============================================================
   老板专属补丁：全区域输入框挤出修复 & 查手机解锁不可见修复
   ============================================================ */

/* 1. 强制所有聊天/私信的消息列表自适应剩余高度绝不撑爆屏幕将底部挤出 */
[data-theme="ins"] .chat-messages,
[data-theme="ins"] .cw-chat-messages,
[data-theme="ins"] .pc-chat-messages,
[data-theme="ins"] .t-dm-messages,
[data-theme="ins"] .cw-msg-list {
    flex: 1 1 0% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
}

/* 2. 统一修复所有输入区域（全面涵盖查手机、CW、QQ等私信和页面） */
[data-theme="ins"] .chat-input-area,
[data-theme="ins"] .cw-chat-input-bar,
[data-theme="ins"] .pc-chat-input-bar,
[data-theme="ins"] .t-dm-input,
[data-theme="ins"] .pc-reverse-input-area {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    /* 强力抬高底部防止全面屏底部黑条或屏幕边缘遮挡 */
    padding-bottom: calc(15px + env(safe-area-inset-bottom, 0px)) !important;
    flex-wrap: nowrap !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    /* 死死锁在底部绝对不准被上面消息区压缩 */
    flex-shrink: 0 !important;
}

/* 3. 核心修复：防止输入框文本太长无限变宽挤走右边的按键 */
[data-theme="ins"] .chat-input-area input,
[data-theme="ins"] .cw-chat-input-bar input,
[data-theme="ins"] .pc-chat-input-bar input,
[data-theme="ins"] .t-dm-input input,
[data-theme="ins"] .pc-reverse-input-area input {
    flex: 1 1 auto !important;
    min-width: 0 !important; /* 打破系统默认最小宽度彻底防止横向撑爆 */
    width: auto !important;
}

/* 4. 绝对保护发送键、生成键的身位一步都不准退 */
[data-theme="ins"] .chat-input-area button,
[data-theme="ins"] .chat-input-area .chat-circle-btn,
[data-theme="ins"] .chat-input-area .send-btn,
[data-theme="ins"] .cw-chat-input-bar button,
[data-theme="ins"] .cw-chat-input-bar .cw-btn,
[data-theme="ins"] .pc-chat-input-bar button,
[data-theme="ins"] .pc-chat-input-bar .pc-chat-send,
[data-theme="ins"] .pc-chat-input-bar .pc-gen-btn,
[data-theme="ins"] .t-dm-input .t-dm-send,
[data-theme="ins"] .pc-reverse-input-area button {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
}

/* 5. 修复 Phone Check（查手机）全屏布局及解锁按钮不可见问题 */
[data-theme="ins"] .pc-app {
    height: 100% !important;
    max-height: 100% !important; /* 强制贴合窗口避免 100vh 在移动端浏览器溢出 */
    display: none;
    flex-direction: column;
}
[data-theme="ins"] .pc-app[style*="display: flex"],
[data-theme="ins"] .pc-app.active,
[data-theme="ins"] .pc-app.pc-active {
    display: flex !important;
}

[data-theme="ins"] .pc-lock-screen {
    /* 缩减顶部冗余留白优先为底部的解锁组件腾出足够展示空间 */
    padding-top: calc(30px + env(safe-area-inset-top, 0px)) !important;
    padding-bottom: calc(40px + env(safe-area-inset-bottom, 20px)) !important;
}

[data-theme="ins"] .pc-lock-bottom {
    /* 强制抬高解锁按钮和输入框 */
    margin-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    flex-shrink: 0 !important;
}
/* ============================================================
   老板专属补丁：INS 主题全面适配查手机 (Phone Check) 模块
   解决解锁按钮不可见及深浅色冲突、手绘风不搭的问题
   ============================================================ */
[data-theme="ins"] .pc-app,
[data-theme="ins"] .pc-page,
[data-theme="ins"] .pc-subpage,
[data-theme="ins"] .pc-select-body,
[data-theme="ins"] .pc-sub-content,
[data-theme="ins"] .pc-phone-wallpaper {
    background: var(--ins-bg) !important;
    color: var(--ins-text) !important;
    font-family: var(--ins-font) !important;
}

/* 头部统一适配 */
[data-theme="ins"] .pc-header {
    background: rgba(255,255,255,0.88) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border-bottom: 1px solid var(--ins-grey-300) !important;
}
[data-theme="ins"] .pc-title,
[data-theme="ins"] .pc-back-btn {
    color: var(--ins-text) !important;
    font-family: var(--ins-font) !important;
}
[data-theme="ins"] .pc-gen-btn {
    background: var(--ins-text) !important;
    color: var(--ins-white) !important;
    border: none !important;
    border-radius: var(--ins-radius-full) !important;
    font-family: var(--ins-font) !important;
}

/* === 核心修复：锁屏界面适配 INS 主题并找回解锁按钮 === */
[data-theme="ins"] .pc-lock-screen {
    background: var(--ins-bg) !important; /* 原本是纯黑背景改为毛玻璃浅色 */
}
[data-theme="ins"] .pc-lock-screen::before,
[data-theme="ins"] .pc-lock-screen::after {
    color: var(--ins-text-pale) !important; /* 修正装饰符号颜色 */
}
[data-theme="ins"] .pc-lock-time {
    color: var(--ins-text) !important;
    font-family: var(--ins-font) !important;
    font-weight: 700 !important;
}
[data-theme="ins"] .pc-lock-date,
[data-theme="ins"] .pc-lock-name,
[data-theme="ins"] .pc-lock-hint {
    color: var(--ins-text-light) !important;
    font-family: var(--ins-font) !important;
}
[data-theme="ins"] .pc-lock-avatar {
    background: var(--ins-grey-200) !important;
    border: 2px solid var(--ins-white) !important;
    box-shadow: var(--ins-shadow-soft) !important;
    color: var(--ins-text-mid) !important;
}
[data-theme="ins"] .pc-lock-avatar img {
    filter: none !important; /* 移除原来的灰色滤镜恢复彩色头像 */
}

/* 解锁输入框与按钮（重新绘制为INS风格） */
[data-theme="ins"] .pc-password-input {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: var(--ins-radius-full) !important;
    color: var(--ins-text) !important;
}
[data-theme="ins"] .pc-password-input::placeholder {
    color: var(--ins-text-pale) !important;
}
[data-theme="ins"] .pc-password-input:focus {
    border-color: var(--ins-text-mid) !important;
    box-shadow: 0 0 0 3px rgba(150,150,150,0.1) !important;
}
[data-theme="ins"] .pc-unlock-btn {
    background: var(--ins-text) !important;
    color: var(--ins-white) !important;
    border: none !important;
    box-shadow: var(--ins-shadow-soft) !important;
}
[data-theme="ins"] .pc-force-btn {
    background: transparent !important;
    border: 1px solid var(--ins-grey-400) !important;
    color: var(--ins-text-mid) !important;
}

/* 内部卡片与元素全部去手绘黑线改为圆角玻璃质感 */
[data-theme="ins"] .pc-char-card,
[data-theme="ins"] .pc-setting-card,
[data-theme="ins"] .pc-qq-item,
[data-theme="ins"] .pc-st-total,
[data-theme="ins"] .pc-st-item,
[data-theme="ins"] .pc-st-detail-card,
[data-theme="ins"] .pc-acc-header,
[data-theme="ins"] .pc-acc-capsule,
[data-theme="ins"] .pc-acc-detail-card,
[data-theme="ins"] .pc-note-card,
[data-theme="ins"] .pc-browser-item,
[data-theme="ins"] .pc-browser-detail-card,
[data-theme="ins"] .pc-identity-card,
[data-theme="ins"] .pc-offline-scene,
[data-theme="ins"] .pc-home-banner {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: var(--ins-radius-xl) !important;
    box-shadow: var(--ins-shadow-soft) !important;
    color: var(--ins-text) !important;
    font-family: var(--ins-font) !important;
}

[data-theme="ins"] .pc-char-name,
[data-theme="ins"] .pc-setting-info,
[data-theme="ins"] .pc-qq-name,
[data-theme="ins"] .pc-st-name,
[data-theme="ins"] .pc-acc-cap-name,
[data-theme="ins"] .pc-note-card-title,
[data-theme="ins"] .pc-browser-title,
[data-theme="ins"] .pc-identity-card .id-label {
    font-family: var(--ins-font) !important;
    color: var(--ins-text) !important;
}

/* 去除原本的粗黑头像边框 */
[data-theme="ins"] .pc-char-avatar,
[data-theme="ins"] .pc-qq-avatar,
[data-theme="ins"] .pc-st-icon,
[data-theme="ins"] .pc-browser-icon,
[data-theme="ins"] .pc-banner-ava {
    border: 1px solid var(--ins-grey-300) !important;
    background: var(--ins-grey-100) !important;
    border-radius: 50% !important;
}

[data-theme="ins"] .pc-chat-b-avatar {
    border: 1.5px solid var(--ins-grey-300) !important;
}

/* 聊天气泡统一修复 */
[data-theme="ins"] .pc-chat-messages {
    background: var(--ins-bg) !important;
}
[data-theme="ins"] .pc-chat-bubble {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    border-radius: 18px 18px 18px 4px !important;
    box-shadow: var(--ins-shadow-soft) !important;
    color: var(--ins-text) !important;
}
[data-theme="ins"] .pc-self .pc-chat-bubble {
    background: var(--ins-grey-200) !important;
    border: none !important;
    border-radius: 18px 18px 4px 18px !important;
}

/* 图标与桌面大组件强力修正 */
[data-theme="ins"] .pc-icon-box {
    border: 1px solid var(--ins-glass-border) !important;
    background: var(--ins-glass-heavy) !important;
    backdrop-filter: var(--ins-blur) !important;
    border-radius: var(--ins-radius-md) !important;
    box-shadow: var(--ins-shadow-soft) !important;
    color: var(--ins-text-mid) !important;
    transform: none !important; /* 修正原本随意的倾斜感 */
}
[data-theme="ins"] .pc-app-icon span {
    color: var(--ins-text) !important;
    font-family: var(--ins-font) !important;
}

[data-theme="ins"] .pc-widget-dark {
    background: var(--ins-white) !important;
    border: 1px solid var(--ins-grey-300) !important;
    box-shadow: var(--ins-shadow-soft) !important;
    color: var(--ins-text) !important;
}
[data-theme="ins"] .pc-wd-initial,
[data-theme="ins"] .pc-wd-name,
[data-theme="ins"] .pc-wd-rule,
[data-theme="ins"] .pc-wd-sub,
[data-theme="ins"] .pc-wd-corner-tl,
[data-theme="ins"] .pc-wd-corner-tr,
[data-theme="ins"] .pc-wd-corner-bl,
[data-theme="ins"] .pc-wd-corner-br {
    color: var(--ins-text) !important;
    text-shadow: none !important;
}
[data-theme="ins"] .pc-widget-pin {
    border: 1px solid var(--ins-grey-300) !important;
}

/* 去掉全部黑白灰度滤镜 */
[data-theme="ins"] .pc-app img { filter: none !important; }
/* ============================================================
   老板专属补丁：修复查手机锁屏输入框过长挤走解锁按钮的问题
   ============================================================ */
[data-theme="ins"] .pc-lock-input-wrap {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 280px !important; /* 锁死最大宽度绝不让它撑爆全屏 */
    box-sizing: border-box !important;
    margin: 0 auto !important; /* 保证居中 */
}

[data-theme="ins"] .pc-password-input {
    flex: 1 1 auto !important; /* 只能占用剩余空间 */
    min-width: 0 !important; /* 核心：打破浏览器默认最小宽度强行让其屈服不准变长 */
    width: 100% !important;
}

[data-theme="ins"] .pc-unlock-btn {
    flex-shrink: 0 !important; /* 绝对身位保护：宁可天塌下来也绝不准压缩和挤出该按钮 */
}