/* ========================================================
           高配版：响应式适配 + 视觉抗疲劳优化
           ======================================================== */
        :root { 
            --bg-color: #F5F5F7;          
            --text-main: #1D1D1F;         
            --text-sub: #86868B;          
            
            /* --- 黑白强调色系统 --- */
            --accent-green: #1D1D1F;       
            --accent-green-hover: #000000; 
            --accent-light: rgba(0, 0, 0, 0.06); 

            /* --- 全屏网页底图接入点 --- */
            --page-bg-img: url('bg.webp');

            --card-bg: rgba(255, 255, 255, 0.88); 
            
            --shadow-sm: 0 4px 16px rgba(0,0,0,0.04);
            --shadow-lg: 0 12px 40px rgba(0,0,0,0.08), 0 2px 6px rgba(0,0,0,0.02);
            --ease-apple: cubic-bezier(0.16, 1, 0.3, 1); 
            --mx: 0;
            --my: 0;
            --green-rgb: 36, 138, 61;
        }

        #site-footer {
            margin: 0;
            padding: 10px 12px 14px;
            text-align: center;
            color: var(--text-sub);
            font-weight: 500;
            background: transparent !important;
            box-shadow: none !important;
            border: none;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }
        .site-footer-disclaimer {
            margin: 0 0 8px;
            max-width: none;
            margin-left: auto;
            margin-right: auto;
            padding: 0;
            font-size: 0.68rem;
            line-height: 1.55;
            letter-spacing: 0.02em;
            color: #A1A1A6;
            font-weight: 400;
            background: transparent;
        }
        .site-footer-disclaimer-line {
            display: block;
            white-space: nowrap;
            background: transparent;
        }
        .site-footer-copy {
            margin: 0;
            font-size: 0.85rem;
            letter-spacing: 0.05em;
            color: var(--text-sub);
            font-weight: 500;
            line-height: 1.45;
            background: transparent;
        }

        body { 
            margin: 0; 
            display: flex; 
            flex-direction: column;
            justify-content: center; 
            align-items: stretch; 
            min-height: 100vh; 
            
            /* --- 应用全屏背景底图 --- */
            background-image: var(--page-bg-img);
            background-size: cover;
            background-position: center;
            background-attachment: fixed; 
            background-repeat: no-repeat;
            background-color: var(--bg-color); 
            
            font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Noto Sans SC", sans-serif; 
            padding: 40px 20px; 
            color: var(--text-main); 
            -webkit-font-smoothing: antialiased;
        }

        .container { 
            text-align: center; 
            width: 100%; 
            max-width: 100%;
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        /* --- 登录区：居中「左品牌 + 右登录」双栏构图 --- */
        .login-layout {
            position: relative;
            isolation: isolate;
            overflow: hidden;
            width: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: clamp(40px, 5vw, 80px);
            padding: 0 clamp(48px, 10vw, 140px);
            box-sizing: border-box;
            background: transparent;
        }
        .login-anchor {
            width: 100%;
            max-width: 420px;
            flex: 0 0 auto;
            display: flex;
            position: relative;
            z-index: 2;
        }

        /* --- 登录页顶栏 --- */
        .login-topbar {
            position: absolute;
            top: 0; left: 0; right: 0;
            height: 58px;
            z-index: 20;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 clamp(18px, 2.4vw, 28px);
            box-sizing: border-box;
            background: rgba(255, 255, 255, 0.86);
            backdrop-filter: blur(20px) saturate(1.05);
            -webkit-backdrop-filter: blur(20px) saturate(1.05);
            border-bottom: 1px solid rgba(0, 0, 0, 0.08);
            box-shadow: 0 1px 0 rgba(255,255,255,0.7) inset, 0 2px 8px rgba(29, 29, 31, 0.03);
            pointer-events: auto;
        }
        .login-topbar-logo {
            font-size: 1.22rem;
            font-weight: 800;
            letter-spacing: 0.16em;
            color: #1d1d1f;
            line-height: 1;
            user-select: none;
            display: flex;
            align-items: center;
        }
        .login-topbar-actions {
            display: flex;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
        }
        .login-topbar-help-btn {
            appearance: none; -webkit-appearance: none;
            height: 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1.5px solid rgba(0, 0, 0, 0.28);
            background: #ffffff;
            font-family: inherit;
            font-size: 0.9rem;
            font-weight: 600;
            color: #1d1d1f;
            cursor: pointer;
            padding: 0 16px;
            border-radius: 999px;
            line-height: 1;
            box-sizing: border-box;
            transition: background 0.2s ease, border-color 0.2s ease;
            white-space: nowrap;
        }
        .login-topbar-help-btn:hover {
            background: #f5f5f7;
            border-color: rgba(0, 0, 0, 0.4);
            color: #1d1d1f;
        }

        /* --- 使用说明弹层 --- */
        #usage-guide-modal {
            display: none;
            position: fixed; inset: 0; z-index: 10020;
            align-items: center; justify-content: center;
            padding: 24px 16px; box-sizing: border-box;
        }
        #usage-guide-modal.open { display: flex; }
        .usage-guide-backdrop {
            position: absolute; inset: 0;
            background: rgba(0, 0, 0, 0.42);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
        }
        .usage-guide-panel {
            position: relative; z-index: 1;
            width: min(1000px, 96vw);
            height: min(88vh, 820px);
            max-height: min(88vh, 820px);
            background: #ffffff;
            border-radius: 18px;
            box-shadow: 0 24px 64px rgba(0, 0, 0, 0.22);
            display: flex; flex-direction: column;
            overflow: hidden;
        }
        .usage-guide-header {
            flex-shrink: 0;
            display: flex; align-items: center; justify-content: space-between; gap: 12px;
            padding: 22px 28px 18px 32px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        }
        .usage-guide-title {
            margin: 0;
            font-size: 1.28rem; font-weight: 800;
            color: #1d1d1f; letter-spacing: -0.01em;
        }
        .usage-guide-x {
            appearance: none; -webkit-appearance: none;
            width: 36px; height: 36px; border: none; border-radius: 10px;
            background: transparent; color: #86868b;
            font-size: 1.35rem; line-height: 1; cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            transition: background 0.2s ease, color 0.2s ease;
            flex-shrink: 0;
        }
        .usage-guide-x:hover { background: #f5f5f7; color: #1d1d1f; }

        .usage-guide-split {
            flex: 1; min-height: 0;
            display: flex; align-items: stretch;
        }
        .usage-guide-nav {
            width: 260px; flex-shrink: 0;
            border-right: 1px solid rgba(0, 0, 0, 0.06);
            background: #fafafa;
            padding: 16px 14px;
            overflow-y: auto;
            box-sizing: border-box;
            -webkit-overflow-scrolling: touch;
        }
        .usage-guide-nav-item {
            display: block; width: 100%;
            text-align: left;
            appearance: none; -webkit-appearance: none;
            border: none; background: transparent;
            font-family: inherit; cursor: pointer;
            padding: 12px 16px; margin-bottom: 5px;
            border-radius: 10px;
            font-size: 0.92rem; font-weight: 600;
            color: #6e6e73;
            transition: background 0.12s ease, color 0.12s ease;
        }
        /* 悬停 / 选中同款高亮，色块跟手 */
        .usage-guide-nav-item:hover,
        .usage-guide-nav-item.active {
            background: #1d1d1f; color: #ffffff;
        }
        .usage-guide-nav-num {
            display: inline-block; min-width: 1.2em;
            margin-right: 6px; opacity: 0.7; font-variant-numeric: tabular-nums;
        }
        .usage-guide-nav-item:hover .usage-guide-nav-num,
        .usage-guide-nav-item.active .usage-guide-nav-num { opacity: 1; }

        .usage-guide-detail {
            position: relative;
            flex: 1; min-width: 0; min-height: 0;
            display: flex; flex-direction: column;
            padding: 32px 40px 28px;
            overflow-y: auto;
            text-align: left;
            box-sizing: border-box;
            -webkit-overflow-scrolling: touch;
        }
        .usage-guide-step-count {
            position: absolute;
            top: 28px; right: 36px;
            font-size: 0.82rem; font-weight: 700;
            color: #aeaeb2; letter-spacing: 0.04em;
            font-variant-numeric: tabular-nums;
            pointer-events: none;
        }
        .usage-guide-lead {
            margin: 0 72px 22px 0;
            font-size: 14px; line-height: 1.75;
            color: #86868b;
        }
        .usage-guide-lead.hidden { display: none; }
        .usage-guide-detail-title {
            margin: 0 72px 14px 0;
            font-size: 19px; font-weight: 800;
            color: #1d1d1f; letter-spacing: -0.01em;
            display: flex; align-items: center; gap: 10px;
            line-height: 1.3;
        }
        .usage-guide-detail-icon {
            width: 28px; height: 28px; flex-shrink: 0;
            display: inline-flex; align-items: center; justify-content: center;
            color: #1d1d1f;
        }
        .usage-guide-detail-icon svg {
            width: 22px; height: 22px; display: block;
            stroke: currentColor; fill: none;
            stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
        }
        .usage-guide-detail-summary {
            margin: 0 0 16px;
            font-size: 15.5px; line-height: 1.8;
            color: #48484a;
        }
        .usage-guide-detail-list {
            margin: 0; padding: 0 0 0 0;
            list-style: none;
        }
        .usage-guide-detail-list li {
            position: relative;
            margin: 0 0 12px;
            padding-left: 18px;
            font-size: 15.5px; line-height: 1.8;
            color: #6e6e73;
        }
        .usage-guide-detail-list li::before {
            content: '';
            position: absolute; left: 0; top: 0.72em;
            width: 6px; height: 6px; border-radius: 50%;
            background: #1d1d1f; opacity: 0.35;
        }
        .usage-guide-detail-list li:last-child { margin-bottom: 0; }
        .usage-guide-note {
            margin-top: auto;
            padding-top: 28px;
            font-size: 13px; line-height: 1.65;
            color: #aeaeb2;
        }

        .usage-guide-footer {
            flex-shrink: 0;
            display: flex; justify-content: flex-end;
            padding: 16px 28px 22px;
            border-top: 1px solid rgba(0, 0, 0, 0.06);
            background: #ffffff;
        }
        .usage-guide-close-btn {
            min-width: 140px;
            padding: 12px 24px;
            background: #1d1d1f; color: #fff;
            border: none; border-radius: 12px;
            font-family: inherit; font-size: 0.95rem; font-weight: 600;
            cursor: pointer;
            transition: background 0.2s ease, transform 0.2s ease;
        }
        .usage-guide-close-btn:hover { background: #000; transform: scale(1.01); }

        @media (max-width: 720px) {
            .usage-guide-panel {
                width: min(1000px, 96vw);
                height: min(90vh, 820px);
                max-height: min(90vh, 820px);
            }
            .usage-guide-split { flex-direction: column; }
            .usage-guide-nav {
                width: 100%;
                border-right: none;
                border-bottom: 1px solid rgba(0, 0, 0, 0.06);
                padding: 10px 12px;
                display: flex; flex-wrap: nowrap; gap: 6px;
                overflow-x: auto; overflow-y: hidden;
            }
            .usage-guide-nav-item {
                flex: 0 0 auto;
                width: auto;
                white-space: nowrap;
                margin-bottom: 0;
                padding: 9px 14px;
                font-size: 0.82rem;
            }
            .usage-guide-detail { padding: 24px 22px 18px; }
            .usage-guide-header { padding: 16px 16px 12px 18px; }
            .usage-guide-footer {
                justify-content: stretch;
                padding: 12px 16px 16px;
            }
            .usage-guide-close-btn { width: 100%; min-width: 0; }
        }

        /* --- 我的账号弹层 --- */
        #account-modal {
            display: none;
            position: fixed; inset: 0; z-index: 10025;
            align-items: center; justify-content: center;
            padding: 24px 16px; box-sizing: border-box;
        }
        #account-modal.open { display: flex; }
        .account-backdrop {
            position: absolute; inset: 0;
            background: rgba(0, 0, 0, 0.42);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
        }
        .account-panel {
            position: relative; z-index: 1;
            width: min(720px, 96vw);
            max-height: 85vh;
            background: #ffffff;
            border-radius: 18px;
            box-shadow: 0 24px 64px rgba(0, 0, 0, 0.22);
            display: flex; flex-direction: column;
            overflow: hidden;
        }
        .account-header {
            flex-shrink: 0;
            display: flex; align-items: center; justify-content: space-between; gap: 12px;
            padding: 20px 24px 16px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        }
        .account-title {
            margin: 0;
            font-size: 1.2rem; font-weight: 800;
            color: #1d1d1f; letter-spacing: -0.01em;
        }
        .account-x {
            appearance: none; -webkit-appearance: none;
            width: 36px; height: 36px; border: none; border-radius: 10px;
            background: transparent; color: #86868b;
            font-size: 1.35rem; line-height: 1; cursor: pointer;
            display: flex; align-items: center; justify-content: center;
        }
        .account-x:hover { background: #f5f5f7; color: #1d1d1f; }
        .account-body {
            flex: 1; min-height: 0;
            overflow-y: auto;
            padding: 18px 24px 8px;
            text-align: left;
            -webkit-overflow-scrolling: touch;
        }
        .account-loading,
        .account-error {
            margin: 24px 0;
            text-align: center;
            font-size: 0.95rem;
            color: #6e6e73;
            line-height: 1.6;
        }
        .account-error { color: #b42318; }
        .account-section { margin-bottom: 22px; }
        .account-section-title {
            margin: 0 0 12px;
            font-size: 0.95rem;
            font-weight: 800;
            color: #1d1d1f;
        }
        .account-overview {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
        }
        .account-stat {
            background: #f5f5f7;
            border: 1px solid rgba(0,0,0,0.05);
            border-radius: 12px;
            padding: 12px 12px 11px;
        }
        .account-stat-label {
            display: block;
            font-size: 0.75rem;
            color: #86868b;
            font-weight: 600;
            margin-bottom: 4px;
        }
        .account-stat-value {
            display: block;
            font-size: 1.05rem;
            font-weight: 800;
            color: #1d1d1f;
            word-break: break-all;
            line-height: 1.3;
        }
        .account-list {
            border: 1px solid rgba(0,0,0,0.06);
            border-radius: 12px;
            background: #fafafa;
            max-height: 220px;
            overflow-y: auto;
        }
        .account-row {
            display: grid;
            gap: 6px 10px;
            padding: 11px 12px;
            border-bottom: 1px solid rgba(0,0,0,0.05);
            font-size: 0.86rem;
            line-height: 1.45;
            color: #3a3a3c;
        }
        .account-row:last-child { border-bottom: none; }
        .account-points-row {
            grid-template-columns: 1.1fr 0.7fr 1.1fr 0.8fr;
            align-items: center;
        }
        .account-task-row {
            grid-template-columns: 1.1fr 0.7fr 1.8fr;
            align-items: start;
        }
        .account-row-head {
            position: sticky; top: 0;
            background: #f0f0f2;
            font-size: 0.75rem;
            font-weight: 700;
            color: #6e6e73;
            z-index: 1;
        }
        .account-change.pos { color: #1F9D55; font-weight: 700; }
        .account-change.neg { color: #1d1d1f; font-weight: 700; }
        .account-empty {
            padding: 22px 14px;
            text-align: center;
            color: #86868b;
            font-size: 0.88rem;
        }
        .account-footer {
            flex-shrink: 0;
            display: flex; justify-content: flex-end;
            padding: 14px 24px 18px;
            border-top: 1px solid rgba(0, 0, 0, 0.06);
            background: #fff;
        }
        .account-close-btn {
            min-width: 120px;
            padding: 11px 22px;
            background: #1d1d1f; color: #fff;
            border: none; border-radius: 12px;
            font-family: inherit; font-size: 0.92rem; font-weight: 600;
            cursor: pointer;
        }
        .account-close-btn:hover { background: #000; }
        .ws-account-btn,
        .form-account-btn {
            appearance: none; border: 1px solid rgba(0,0,0,0.14);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.82rem; font-weight: 600;
            padding: 7px 14px; border-radius: 999px; cursor: pointer;
            transition: background 0.2s ease, border-color 0.2s ease;
        }
        .form-account-btn { padding: 6px 12px; flex-shrink: 0; }
        .ws-account-btn:hover,
        .form-account-btn:hover { background: #f5f5f7; border-color: rgba(0,0,0,0.28); }
        @media (max-width: 720px) {
            .account-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
            .account-points-row,
            .account-task-row { grid-template-columns: 1fr; }
            .account-row-head { display: none; }
            .account-body { padding: 16px 16px 6px; }
            .account-header { padding: 16px 16px 12px; }
            .account-footer { padding: 12px 16px 16px; justify-content: stretch; }
            .account-close-btn { width: 100%; }
            .account-list { max-height: 200px; }
        }

        /* --- 关于案几弹层（宽幅分节） --- */
        #about-us-modal {
            display: none;
            position: fixed; inset: 0; z-index: 10020;
            align-items: center; justify-content: center;
            padding: 24px 16px; box-sizing: border-box;
        }
        #about-us-modal.open { display: flex; }
        .about-us-backdrop {
            position: absolute; inset: 0;
            background: rgba(0, 0, 0, 0.42);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
        }
        .about-us-panel {
            position: relative; z-index: 1;
            width: min(960px, 96vw);
            height: min(86vh, 800px);
            max-height: min(86vh, 800px);
            background: #ffffff;
            border-radius: 18px;
            box-shadow: 0 24px 64px rgba(0, 0, 0, 0.22);
            display: flex; flex-direction: column;
            overflow: hidden;
        }
        .about-us-header {
            flex-shrink: 0;
            display: flex; align-items: center; justify-content: space-between; gap: 12px;
            padding: 22px 28px 18px 32px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.06);
        }
        .about-us-title {
            margin: 0;
            font-size: 1.28rem; font-weight: 800;
            color: #1d1d1f; letter-spacing: -0.01em;
        }
        .about-us-x {
            appearance: none; -webkit-appearance: none;
            width: 36px; height: 36px; border: none; border-radius: 10px;
            background: transparent; color: #86868b;
            font-size: 1.35rem; line-height: 1; cursor: pointer;
            display: flex; align-items: center; justify-content: center;
            transition: background 0.2s ease, color 0.2s ease;
            flex-shrink: 0;
        }
        .about-us-x:hover { background: #f5f5f7; color: #1d1d1f; }
        .about-us-split {
            flex: 1; min-height: 0;
            display: flex; align-items: stretch;
        }
        .about-us-nav {
            width: 200px; flex-shrink: 0;
            border-right: 1px solid rgba(0, 0, 0, 0.06);
            background: #fafafa;
            padding: 16px 14px;
            overflow-y: auto;
            box-sizing: border-box;
            -webkit-overflow-scrolling: touch;
        }
        .about-us-nav-item {
            display: block; width: 100%;
            text-align: left;
            appearance: none; -webkit-appearance: none;
            border: none; background: transparent;
            font-family: inherit; cursor: pointer;
            padding: 12px 16px; margin-bottom: 5px;
            border-radius: 10px;
            font-size: 0.92rem; font-weight: 600;
            color: #6e6e73;
            transition: background 0.12s ease, color 0.12s ease;
        }
        .about-us-nav-item:hover,
        .about-us-nav-item.active {
            background: #1d1d1f; color: #ffffff;
        }
        .about-us-nav-num {
            display: inline-block; min-width: 1.2em;
            margin-right: 6px; opacity: 0.7; font-variant-numeric: tabular-nums;
        }
        .about-us-nav-item:hover .about-us-nav-num,
        .about-us-nav-item.active .about-us-nav-num { opacity: 1; }
        .about-us-detail {
            flex: 1; min-width: 0; min-height: 0;
            overflow-y: auto;
            padding: 20px 32px 20px;
            text-align: left;
            box-sizing: border-box;
            -webkit-overflow-scrolling: touch;
            display: flex;
            flex-direction: column;
            align-items: stretch;
            justify-content: flex-start;
        }
        .about-us-pane {
            display: none;
            width: 100%;
            margin: 0;
            padding: 0;
        }
        .about-us-pane.active { display: block; }
        .about-us-heading {
            margin: 0 0 12px;
            font-size: 23px;
            font-weight: 800;
            color: #1d1d1f;
            letter-spacing: -0.01em;
            line-height: 1.35;
        }
        .about-us-motto {
            margin: 0 0 10px;
            font-size: 23px;
            font-weight: 800;
            color: #1d1d1f;
            letter-spacing: 0.03em;
            line-height: 1.35;
        }
        .about-us-tagline {
            margin: 0 0 16px;
            font-size: 16px;
            font-weight: 700;
            color: #1d1d1f;
            letter-spacing: 0.01em;
            line-height: 1.5;
        }
        .about-us-lead {
            margin: 0 0 16px;
            font-size: 15.5px;
            line-height: 1.75;
            color: #3a3a3c;
        }
        .about-us-p {
            margin: 0 0 14px;
            font-size: 15.5px;
            line-height: 1.75;
            color: #3a3a3c;
        }
        .about-us-p:last-child { margin-bottom: 0; }
        .about-us-closeup {
            margin: 18px 0 0;
            padding: 0;
        }
        .about-us-closeup .about-us-p { margin-bottom: 10px; }
        .about-us-closeup .about-us-p:last-child { margin-bottom: 0; }
        .about-us-list {
            margin: 0 0 0;
            padding: 0;
            list-style: none;
        }
        .about-us-list + .about-us-closeup,
        .about-us-lead + .about-us-list {
            margin-top: 0;
        }
        .about-us-list li {
            position: relative;
            margin: 0 0 14px;
            padding-left: 16px;
            font-size: 15.5px;
            line-height: 1.75;
            color: #3a3a3c;
        }
        .about-us-list li:last-child { margin-bottom: 0; }
        .about-us-list li::before {
            content: '';
            position: absolute; left: 0; top: 0.72em;
            width: 5px; height: 5px; border-radius: 50%;
            background: #1d1d1f; opacity: 0.4;
        }
        .about-us-closing-line {
            margin: 20px 0 0;
            padding-top: 16px;
            border-top: 1px solid rgba(0, 0, 0, 0.06);
            font-size: 18px;
            font-weight: 800;
            color: #1d1d1f;
            letter-spacing: 0.03em;
            line-height: 1.4;
        }
        /* 工作台状态块 */
        .about-ws-grid {
            display: flex;
            flex-direction: column;
            gap: 12px;
            margin: 4px 0 0;
        }
        .about-ws-row {
            display: flex;
            align-items: flex-start;
            gap: 14px;
            padding: 14px 16px;
            border-radius: 12px;
            background: #fafafa;
            border: 1px solid rgba(0, 0, 0, 0.06);
            border-left-width: 3px;
            box-sizing: border-box;
        }
        .about-ws-row.available {
            border-left-color: #1F9D55;
            background: rgba(52, 199, 89, 0.05);
        }
        .about-ws-row.beta {
            border-left-color: #B26A00;
            background: rgba(255, 179, 64, 0.07);
        }
        .about-ws-row.coming {
            border-left-color: #aeaeb2;
            background: #fafafa;
        }
        .about-ws-main { flex: 1; min-width: 0; }
        .about-ws-top {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px 10px;
            margin-bottom: 6px;
        }
        .about-ws-name {
            font-size: 15.5px;
            font-weight: 700;
            color: #1d1d1f;
            line-height: 1.35;
        }
        .about-ws-row.coming .about-ws-name { color: #6e6e73; }
        .about-ws-badge {
            display: inline-flex;
            align-items: center;
            height: 22px;
            padding: 0 9px;
            border-radius: 999px;
            font-size: 11px;
            font-weight: 700;
            letter-spacing: 0.02em;
            line-height: 1;
            flex-shrink: 0;
        }
        .about-ws-row.available .about-ws-badge {
            color: #1F9D55;
            background: rgba(52, 199, 89, 0.14);
        }
        .about-ws-row.beta .about-ws-badge {
            color: #B26A00;
            background: rgba(255, 179, 64, 0.18);
            border: 1px solid rgba(178, 106, 0, 0.22);
        }
        .about-ws-row.coming .about-ws-badge {
            color: #86868b;
            background: rgba(0, 0, 0, 0.06);
        }
        .about-ws-desc {
            margin: 0;
            font-size: 14.5px;
            line-height: 1.65;
            color: #3a3a3c;
        }
        .about-ws-row.coming .about-ws-desc { color: #6e6e73; }
        .about-us-footer {
            flex-shrink: 0;
            display: flex; justify-content: flex-end;
            padding: 14px 28px 20px;
            border-top: 1px solid rgba(0, 0, 0, 0.06);
            background: #ffffff;
        }
        .about-us-next-btn {
            min-width: 140px;
            padding: 12px 24px;
            background: #1d1d1f; color: #fff;
            border: none; border-radius: 12px;
            font-family: inherit; font-size: 0.95rem; font-weight: 600;
            cursor: pointer;
            transition: background 0.2s ease, transform 0.2s ease;
        }
        .about-us-next-btn:hover { background: #000; transform: scale(1.01); }

        @media (max-width: 720px) {
            .about-us-panel {
                width: min(960px, 96vw);
                height: min(90vh, 800px);
                max-height: min(90vh, 800px);
            }
            .about-us-split { flex-direction: column; }
            .about-us-nav {
                width: 100%;
                border-right: none;
                border-bottom: 1px solid rgba(0, 0, 0, 0.06);
                padding: 10px 12px;
                display: flex; flex-wrap: nowrap; gap: 6px;
                overflow-x: auto; overflow-y: hidden;
            }
            .about-us-nav-item {
                flex: 0 0 auto;
                width: auto;
                white-space: nowrap;
                margin-bottom: 0;
                padding: 9px 14px;
                font-size: 0.82rem;
            }
            .about-us-header { padding: 16px 16px 12px 18px; }
            .about-us-title { font-size: 1.1rem; }
            .about-us-detail { padding: 16px 18px 14px; }
            .about-us-motto,
            .about-us-heading { font-size: 22px; }
            .about-us-footer {
                justify-content: stretch;
                padding: 12px 16px 16px;
            }
            .about-us-next-btn { width: 100%; min-width: 0; }
            .login-topbar-actions { gap: 8px; }
            .login-topbar-help-btn {
                padding: 0 12px;
                font-size: 0.84rem;
            }
        }
        @media (max-width: 380px) {
            .login-topbar-help-btn {
                padding: 0 10px;
                font-size: 0.8rem;
            }
        }

        /* --- 登录页背景：浅色科技网格 --- */
        body:has(#login-layout:not(.hidden)) {
            background-color: #f3f4f6;
            background-image: none;
        }
        body:has(#login-layout:not(.hidden)) .container {
            background: transparent;
        }
        /* 页脚叠在登录网格上：透明，无白底垫块 */
        #login-layout #site-footer {
            position: absolute;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 6;
            margin: 0;
            padding: 10px 12px 16px;
            background: transparent !important;
            pointer-events: none;
        }
        #login-layout #site-footer .site-footer-disclaimer,
        #login-layout #site-footer .site-footer-copy {
            pointer-events: auto;
        }
        .login-layout::before {
            content: '';
            position: absolute;
            inset: 0;
            background-image:
                linear-gradient(rgba(29, 29, 31, 0.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(29, 29, 31, 0.035) 1px, transparent 1px);
            background-size: 36px 36px;
            z-index: 0;
            pointer-events: none !important;
        }
        .login-layout::after {
            content: '';
            position: absolute;
            inset: 0;
            background:
                radial-gradient(ellipse 42% 50% at 48% 50%, rgba(255, 255, 255, 0.48), transparent 70%),
                radial-gradient(circle at 32% 36%, rgba(0, 0, 0, 0.035), transparent 50%);
            z-index: 0;
            pointer-events: none !important;
        }
        .login-bridge-glow {
            position: absolute;
            left: 50%;
            top: 50%;
            width: min(280px, 22vw);
            height: min(320px, 38vh);
            transform: translate(-50%, -50%);
            background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.55) 0%, rgba(243, 244, 246, 0.12) 52%, transparent 74%);
            z-index: 0;
            pointer-events: none !important;
        }
        /* --- 淡绿光晕（主 / 副）--- */
        .login-glow-main,
        .login-glow-soft {
            position: absolute;
            border-radius: 50%;
            z-index: 0;
            pointer-events: none !important;
        }
        .login-glow-main {
            width: min(600px, 50vw);
            height: min(600px, 50vw);
            left: 22%;
            top: 18%;
            background: radial-gradient(circle,
                rgba(var(--green-rgb), 0.22) 0%,
                rgba(var(--green-rgb), 0.09) 42%,
                transparent 72%);
            filter: blur(8px);
        }
        .login-glow-soft {
            width: min(460px, 40vw);
            height: min(460px, 40vw);
            right: 4%;
            top: 24%;
            background: radial-gradient(circle,
                rgba(var(--green-rgb), 0.2) 0%,
                rgba(var(--green-rgb), 0.08) 45%,
                transparent 70%);
            filter: blur(10px);
        }
        /* --- 稀疏点线网络 --- */
        .login-dots-layer {
            position: absolute;
            inset: 0;
            z-index: 0;
            pointer-events: none !important;
        }
        .login-dot {
            position: absolute;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: rgba(29, 29, 31, 0.22);
        }
        .login-dot.is-on {
            width: 7.5px;
            height: 7.5px;
            background: rgba(var(--green-rgb), 0.6);
            box-shadow: 0 0 12px rgba(var(--green-rgb), 0.4);
        }
        .login-dot-line {
            position: absolute;
            height: 1.4px;
            background: linear-gradient(90deg, rgba(29, 29, 31, 0.1), rgba(var(--green-rgb), 0.32), rgba(29, 29, 31, 0.08));
            transform-origin: left center;
            transform: rotate(var(--rot, 0deg));
        }
        /* 点：明显的漂移轨迹（幅度约 14–26px，6–11s 循环，delay 由 JS 错开） */
        @keyframes loginDotDriftA { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(16px, -20px) scale(1.15); } }
        @keyframes loginDotDriftB { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(-22px, 14px) scale(1.1); } }
        @keyframes loginDotDriftC { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(19px, 21px) scale(1.15); } }
        @keyframes loginDotDriftD { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(-16px, -24px) scale(1.1); } }
        @keyframes loginDotDriftE { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(25px, -10px) scale(1.15); } }
        /* 线：旋转角度固定（--rot 由 JS 设定），叠加轻微位移轨迹 + 明暗呼吸 */
        @keyframes loginLineDriftA {
            0%, 100% { transform: rotate(var(--rot, 0deg)) translate(0, 0); opacity: 0.45; }
            50% { transform: rotate(var(--rot, 0deg)) translate(7px, -9px); opacity: 1; }
        }
        @keyframes loginLineDriftB {
            0%, 100% { transform: rotate(var(--rot, 0deg)) translate(0, 0); opacity: 0.45; }
            50% { transform: rotate(var(--rot, 0deg)) translate(-8px, 7px); opacity: 1; }
        }
        @keyframes loginLineDriftC {
            0%, 100% { transform: rotate(var(--rot, 0deg)) translate(0, 0); opacity: 0.45; }
            50% { transform: rotate(var(--rot, 0deg)) translate(6px, 10px); opacity: 1; }
        }

        /* --- 左栏：ANJI 品牌 + 过渡几何（文档流，垂直居中） --- */
        .login-visual {
            position: relative;
            flex: 1 1 0;
            max-width: 520px;
            min-height: 420px;
            display: flex;
            align-items: center;
            z-index: 1;
            pointer-events: none !important;
        }
        .login-visual *,
        .login-brand,
        .login-brand-letters,
        .login-brand-letters span,
        .login-brand-en,
        .login-brand-desc {
            pointer-events: none !important;
        }
        .login-geo {
            position: absolute;
            border-radius: 28px;
            background: linear-gradient(135deg, rgba(255,255,255,0.92), rgba(255,255,255,0.5));
            border: 1px solid rgba(0,0,0,0.06);
            box-shadow: 0 24px 48px rgba(0,0,0,0.07), inset 0 1px 0 rgba(255,255,255,0.9), inset 0 -1px 0 rgba(0,0,0,0.03);
            backdrop-filter: blur(6px) saturate(140%);
            -webkit-backdrop-filter: blur(6px) saturate(140%);
            /* transform 交给 JS 的“躲避鼠标”逻辑控制，用较柔和的缓动 */
            transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
            pointer-events: none !important;
            will-change: transform;
        }
        /* 浮动用 margin，避开 transform（留给躲避鼠标逻辑） */
        .login-geo-1 {
            width: 200px; height: 200px; border-radius: 50%;
            top: -36px; left: -24px;
            background: linear-gradient(135deg, rgba(var(--green-rgb), 0.07), rgba(255,255,255,0.55));
            border-color: rgba(0,0,0,0.06);
            animation: loginGeoFloatA 9s ease-in-out infinite;
            pointer-events: none !important;
        }
        .login-geo-2 {
            width: 128px; height: 128px;
            bottom: 24px; left: 36px;
            animation: loginGeoFloatB 11s ease-in-out infinite;
            pointer-events: none !important;
        }
        @keyframes loginGeoFloatA {
            0%, 100% { margin-top: 0; }
            50% { margin-top: -12px; }
        }
        @keyframes loginGeoFloatB {
            0%, 100% { margin-bottom: 0; }
            50% { margin-bottom: -10px; }
        }
        @keyframes loginGeoFloatC {
            0%, 100% { margin-top: 0; }
            50% { margin-top: -8px; }
        }
        .login-geo-4, .login-geo-5 { display: none !important; }
        .login-brand {
            position: relative;
            z-index: 2;
        }
        .login-brand-letters {
            display: flex; gap: 0.04em;
            font-size: clamp(72px, 8vw, 112px);
            font-weight: 800; letter-spacing: -0.03em;
            color: #1d1d1f; line-height: 0.92;
            perspective: 500px;
        }
        .login-brand-letters span {
            display: inline-block; opacity: 0; transform: translateY(18px);
            animation: loginLetterIn 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
            animation-delay: calc(var(--i) * 0.09s + 0.15s);
        }
        @keyframes loginLetterIn { to { opacity: 1; transform: translateY(0); } }
        /* ANJI 字母每隔几秒轻轻做一次 3D 翻转 */
        .login-brand-flip {
            display: inline-block;
            font-style: normal;
            backface-visibility: hidden;
            animation: loginBrandFlip 6s ease-in-out infinite;
            animation-delay: calc(var(--i) * 0.12s + 2.4s);
        }
        @keyframes loginBrandFlip {
            0%, 78% { transform: rotateY(0deg); }
            92% { transform: rotateY(180deg); }
            100% { transform: rotateY(360deg); }
        }
        .login-brand-en {
            margin-top: 14px; font-size: clamp(0.9rem, 1.1vw, 1.05rem); font-weight: 700; letter-spacing: 0.24em;
            color: rgba(var(--green-rgb), 0.65); text-transform: uppercase;
        }
        .login-brand-desc {
            margin-top: 10px; font-size: clamp(0.95rem, 1.15vw, 1.1rem); color: #86868b; font-weight: 500;
        }
        @media (min-width: 961px) and (max-width: 1440px) {
            .login-layout { gap: clamp(32px, 4vw, 56px); padding: 0 clamp(40px, 9vw, 100px); }
            .login-visual { max-width: 460px; min-height: 380px; }
            .login-anchor { max-width: 400px; }
        }
        @media (min-width: 1441px) {
            .login-layout { gap: 72px; padding: 0 12vw; }
            .login-visual { max-width: 540px; }
            .login-anchor { max-width: 440px; }
        }
        @media (max-width: 960px) {
            .login-layout {
                flex-direction: column;
                justify-content: flex-start;
                gap: 0;
                padding: 58px 0 0;
            }
            .login-visual {
                display: none !important;
            }
            .login-geo, .login-bridge-glow, .login-dots-layer, .login-glow-soft, .login-glow-main {
                display: none !important;
            }
            .login-anchor { max-width: 100%; width: 100%; }
            .login-topbar {
                position: fixed;
                top: 0; left: 0; right: 0;
                height: calc(54px + env(safe-area-inset-top, 0px));
                padding: env(safe-area-inset-top, 0px) 20px 0;
                background: rgba(255, 255, 255, 0.94);
                backdrop-filter: blur(16px);
                -webkit-backdrop-filter: blur(16px);
                border-bottom: 1px solid rgba(0, 0, 0, 0.08);
                box-shadow: 0 1px 6px rgba(0,0,0,0.03);
            }
            .login-topbar-logo {
                font-size: 1.05rem;
                height: 54px;
            }
            .login-topbar-help-btn {
                height: 32px;
                border: 1.5px solid rgba(0, 0, 0, 0.28);
                background: #fff;
            }
        }
        @media (max-width: 480px) {
            .login-topbar { padding-left: 16px; padding-right: 16px; }
        }

        /* --- 登录卡：毛玻璃 · 苹果克制风 --- */
        .login-anchor,
        #login-section,
        #login-section * {
            pointer-events: auto;
        }
        .login-layout .login-box {
            position: relative;
            z-index: 2;
            width: 100%;
            margin-bottom: 0;
            display: flex;
            flex-direction: column;
            background: rgba(255, 255, 255, 0.38);
            border-radius: 24px;
            border: 1px solid rgba(255, 255, 255, 0.85);
            box-shadow:
                0 10px 40px rgba(0, 0, 0, 0.09),
                inset 0 1px 0 rgba(255, 255, 255, 0.95),
                inset 0 -1px 0 rgba(0, 0, 0, 0.04),
                0 0 0 1px rgba(var(--green-rgb), 0.08);
            backdrop-filter: blur(30px) saturate(1.6);
            -webkit-backdrop-filter: blur(30px) saturate(1.6);
            overflow: hidden;
            animation: loginCardGlow 7s ease-in-out infinite;
        }
        .login-layout .login-box:hover {
            transform: none;
            box-shadow:
                0 12px 44px rgba(0, 0, 0, 0.1),
                inset 0 1px 0 rgba(255, 255, 255, 1),
                inset 0 -1px 0 rgba(0, 0, 0, 0.04),
                0 0 0 1px rgba(var(--green-rgb), 0.14);
        }
        @keyframes loginCardGlow {
            0%, 100% {
                box-shadow:
                    0 10px 40px rgba(0, 0, 0, 0.09),
                    inset 0 1px 0 rgba(255, 255, 255, 0.95),
                    inset 0 -1px 0 rgba(0, 0, 0, 0.04),
                    0 0 0 1px rgba(var(--green-rgb), 0.08);
            }
            50% {
                box-shadow:
                    0 13px 46px rgba(0, 0, 0, 0.11),
                    inset 0 1px 0 rgba(255, 255, 255, 1),
                    inset 0 -1px 0 rgba(0, 0, 0, 0.04),
                    0 0 0 1px rgba(var(--green-rgb), 0.2);
            }
        }
        #login-section .box-content {
            padding: 44px 40px 40px;
            gap: 0;
        }
        #login-section .login-brand-title {
            font-size: 2.15rem;
            font-weight: 700;
            letter-spacing: -0.03em;
            color: #1d1d1f;
            margin: 0 0 6px;
            text-align: center;
        }
        #login-section .slogan-container { margin-bottom: 28px; }
        #login-section .slogan-main {
            color: #86868b;
            font-size: 0.95rem;
            font-weight: 400;
            letter-spacing: 0.01em;
        }
        #login-section label {
            display: block;
            margin-top: 18px;
            margin-bottom: 8px;
            font-size: 0.8rem;
            font-weight: 600;
            color: #6e6e73;
            letter-spacing: 0.01em;
        }
        #login-section label:first-of-type { margin-top: 0; }
        #login-section input[type="text"],
        #login-section input[type="password"] {
            width: 100%;
            box-sizing: border-box;
            background: rgba(255, 255, 255, 0.72);
            border: 1px solid rgba(0, 0, 0, 0.1);
            border-radius: 14px;
            padding: 14px 16px;
            font-size: 1.05rem;
            color: #1d1d1f;
            outline: none;
            transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
            box-shadow: none;
        }
        #login-section input[type="text"]:focus,
        #login-section input[type="password"]:focus {
            background: rgba(255, 255, 255, 0.92);
            border-color: #48484a;
            box-shadow: 0 0 0 3px rgba(29, 29, 31, 0.06);
        }
        #login-section input[type="text"]:-webkit-autofill,
        #login-section input[type="password"]:-webkit-autofill {
            -webkit-box-shadow: 0 0 0 30px rgba(255, 255, 255, 0.85) inset !important;
        }
        #login-section .btn {
            margin-top: 28px;
            width: 100%;
            min-height: 48px;
            padding: 14px 20px;
            background: #1d1d1f;
            color: #ffffff;
            border: none;
            border-radius: 999px;
            font-size: 1.05rem;
            font-weight: 600;
            box-shadow: none;
        }
        #login-section .btn:hover {
            background: #3a3a3c;
            transform: none;
            box-shadow: none;
        }
        #login-section .btn:active {
            background: #000000;
            transform: scale(0.985);
        }
        #login-section .btn:disabled {
            background: #d2d2d7;
            color: #ffffff;
        }
        #login-section .btn-outline {
            margin-top: 12px;
            min-height: 48px;
            background: rgba(255, 255, 255, 0.72);
            color: #48484a;
            border: 1px solid rgba(0, 0, 0, 0.12);
            border-radius: 999px;
            font-weight: 600;
            box-shadow: none;
        }
        #login-section .auth-switch {
            margin: 14px 0 0;
            text-align: center;
            font-size: 0.88rem;
            color: #86868b;
            line-height: 1.5;
        }
        #login-section .auth-switch-btn {
            appearance: none; -webkit-appearance: none;
            border: none; background: none; padding: 0;
            font-family: inherit; font-size: inherit;
            color: #1d1d1f; font-weight: 600;
            cursor: pointer;
            text-decoration: underline;
            text-underline-offset: 3px;
        }
        #login-section .auth-switch-btn:hover {
            color: #000;
        }
        #login-section #login-btn,
        #login-section #register-btn {
            margin-top: 28px;
        }
        #login-section #register-panel label:first-of-type {
            margin-top: 0;
        }
        #login-section .box-content > div[style*="margin-top"] {
            margin-top: 8px !important;
        }
        #login-section .box-content > div[style*="margin-top"] span {
            background: rgba(255, 255, 255, 0.7) !important;
            color: #86868b !important;
            font-weight: 500 !important;
            font-size: 0.82rem !important;
        }
        #login-section .auth-switch {
            margin: 14px 0 0;
            text-align: center;
            font-size: 0.88rem;
            color: #86868b;
            line-height: 1.5;
        }
        #login-section .auth-switch-btn {
            appearance: none; -webkit-appearance: none;
            border: none; background: none; padding: 0;
            font-family: inherit; font-size: inherit;
            color: #1d1d1f; font-weight: 600;
            cursor: pointer; text-decoration: underline;
            text-underline-offset: 3px;
        }
        #login-section .auth-switch-btn:hover { color: #000; }
        #login-section .box-content hr {
            border-top-color: rgba(0, 0, 0, 0.08) !important;
            margin: 18px 0 !important;
        }
        /* 侧栏全局隐藏 */
        .side-panel { display: none !important; }

        /* --- 左右侧栏：iOS 毛玻璃 + 悬停高亮 / 默认淡化 --- */
        .side-panel {
            width: 300px;
            flex-shrink: 0;
            display: flex;
            flex-direction: column;
            text-align: left;
            border-radius: 24px;
            padding: 22px 20px;
            box-sizing: border-box;
            background: rgba(255, 255, 255, 0.38);
            backdrop-filter: blur(40px) saturate(180%);
            -webkit-backdrop-filter: blur(40px) saturate(180%);
            border: 1px solid rgba(255, 255, 255, 0.45);
            box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
            opacity: 0.52;
            transform: scale(0.97);
            filter: saturate(0.85);
            transition:
                opacity 0.5s var(--ease-apple),
                transform 0.5s var(--ease-apple),
                box-shadow 0.5s var(--ease-apple),
                background 0.5s var(--ease-apple),
                border-color 0.5s var(--ease-apple),
                filter 0.5s var(--ease-apple);
            overflow: hidden;
        }
        .side-panel:hover {
            opacity: 1;
            transform: scale(1);
            filter: saturate(1);
            background: rgba(255, 255, 255, 0.78);
            border-color: rgba(255, 255, 255, 0.85);
            box-shadow:
                0 20px 50px rgba(0, 0, 0, 0.1),
                inset 0 1px 0 rgba(255, 255, 255, 0.9);
        }
        .login-layout:has(.side-panel:hover) .side-panel:not(:hover) {
            opacity: 0.32;
            transform: scale(0.96);
            filter: saturate(0.7);
        }
        .side-panel-header {
            font-size: 1.35rem;
            font-weight: 700;
            color: var(--text-main);
            margin-bottom: 16px;
            padding-bottom: 12px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.06);
            letter-spacing: -0.02em;
            flex-shrink: 0;
        }
        .side-panel-body {
            flex: 1;
            min-height: 0;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }
        .side-panel-body::-webkit-scrollbar,
        .announcement-list::-webkit-scrollbar { width: 4px; }
        .side-panel-body::-webkit-scrollbar-thumb,
        .announcement-list::-webkit-scrollbar-thumb {
            background: rgba(0, 0, 0, 0.12);
            border-radius: 4px;
        }

        /* --- 产品介绍 --- */
        .product-feature {
            padding: 12px 14px;
            background: rgba(255, 255, 255, 0.5);
            border-radius: 14px;
            border: 1px solid rgba(255, 255, 255, 0.6);
        }
        .product-feature-icon {
            font-size: 1.1rem;
            margin-bottom: 6px;
        }
        .product-feature-title {
            font-size: 0.92rem;
            font-weight: 700;
            color: var(--text-main);
            margin-bottom: 4px;
            line-height: 1.35;
        }
        .product-feature-desc {
            font-size: 0.8rem;
            color: var(--text-sub);
            line-height: 1.5;
        }
        .product-tagline {
            font-size: 0.82rem;
            color: var(--accent-green);
            font-weight: 600;
            line-height: 1.5;
            padding: 10px 12px;
            background: var(--accent-light);
            border-radius: 12px;
            margin-bottom: 4px;
        }

        /* --- 公告栏 --- */
        .announcement-list {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 12px;
            flex: 1;
            min-height: 0;
            overflow-y: auto;
        }
        .announcement-item {
            padding: 12px 14px;
            background: rgba(255, 255, 255, 0.5);
            border-radius: 14px;
            border: 1px solid rgba(255, 255, 255, 0.55);
        }
        .announcement-date {
            font-size: 0.72rem;
            color: var(--text-sub);
            margin-bottom: 5px;
            font-weight: 500;
        }
        .announcement-title {
            font-size: 0.9rem;
            font-weight: 700;
            color: var(--text-main);
            margin-bottom: 5px;
            line-height: 1.35;
        }
        .announcement-body {
            font-size: 0.8rem;
            color: var(--text-sub);
            line-height: 1.5;
        }
        .announcement-tag {
            display: inline-block;
            font-size: 0.65rem;
            font-weight: 700;
            color: var(--accent-green);
            background: var(--accent-light);
            padding: 2px 8px;
            border-radius: 999px;
            margin-bottom: 6px;
        }

        /* 对话界面时主标题缩小 */
        .container:has(#chat-section:not(.hidden)) .logo {
            font-size: 2.2rem;
            margin-bottom: 12px;
        }

        /* --- 桌面端：一屏无滚动 --- */
        @media (min-width: 961px) {
            html, body { height: 100%; }
            body:has(#login-layout:not(.hidden)) {
                overflow: hidden;
                max-height: 100vh;
                padding: 0;
                box-sizing: border-box;
            }
            body:has(#login-layout:not(.hidden)) .container {
                height: 100%;
                max-height: 100%;
                overflow: hidden;
                justify-content: center;
                align-items: stretch;
            }
            body:has(#login-layout:not(.hidden)) .logo {
                display: none;
            }
            body:has(#login-layout:not(.hidden)) .login-layout {
                flex: 1;
                min-height: 0;
                width: 100%;
                max-width: 100%;
                height: 100%;
                justify-content: center;
                align-items: center;
                background: transparent;
            }
            body:has(#login-layout:not(.hidden)) .login-anchor {
                max-width: 440px;
            }
            body:has(#login-layout:not(.hidden)) .login-box .box-content {
                padding: 44px 40px 40px;
                flex: 1;
                min-height: 0;
                overflow-y: auto;
                display: flex;
                flex-direction: column;
                justify-content: center;
                gap: 0;
            }
            body:has(#login-layout:not(.hidden)) .slogan-container {
                margin-bottom: 28px;
            }
            body:has(#login-layout:not(.hidden)) .slogan-main {
                font-size: 0.95rem;
                margin-bottom: 0;
            }
            body:has(#login-layout:not(.hidden)) .slogan-sub {
                font-size: 1.05rem;
                line-height: 1.5;
            }
            body:has(#login-layout:not(.hidden)) label {
                margin-top: 18px;
                margin-bottom: 8px;
                font-size: 0.8rem;
            }
            body:has(#login-layout:not(.hidden)) label:first-of-type { margin-top: 0; }
            body:has(#login-layout:not(.hidden)) input {
                padding: 14px 16px;
                font-size: 1.05rem;
            }
            body:has(#login-layout:not(.hidden)) .btn {
                margin-top: 28px;
                padding: 14px 20px;
                font-size: 1.05rem;
                min-height: 48px;
                border-radius: 999px;
            }
            body:has(#login-layout:not(.hidden)) .btn-outline {
                margin-top: 12px;
                min-height: 48px;
                border-radius: 999px;
            }
            body:has(#login-layout:not(.hidden)) .login-box .box-content > div[style*="margin-top: 40px"] {
                margin-top: 0 !important;
            }
            body:has(#login-layout:not(.hidden)) .login-box .box-content hr {
                margin: 10px 0 !important;
            }

            /* ── 桌面端：智能体选择页全屏锁定 ── */
            body:has(#agent-select-section:not(.hidden)) {
                overflow: hidden !important;
                height: 100vh !important;
                padding: 0 !important;
            }
            body:has(#agent-select-section:not(.hidden)) .container {
                height: 100vh !important;
                overflow: hidden !important;
                padding: 0 !important;
                max-width: 100% !important;
                display: flex !important;
                flex-direction: column !important;
                align-items: center !important;
                justify-content: center !important;
                box-sizing: border-box !important;
            }
            body:has(#agent-select-section:not(.hidden)) .logo { display: none !important; }
            body:has(#agent-select-section:not(.hidden)) #site-footer { display: none !important; }
            body:has(#agent-select-section:not(.hidden)) #agent-select-section {
                width: 100% !important;
            }

            /* ── 桌面端：对话页全屏锁定 ── */
            body:has(#chat-section:not(.hidden)) {
                overflow: hidden !important;
                height: 100vh !important;
                padding: 0 !important;
            }
            body:has(#chat-section:not(.hidden)) .container {
                height: 100vh !important;
                overflow: hidden !important;
                padding: 40px 0 !important;
                max-width: 100% !important;
                display: flex !important;
                flex-direction: column !important;
                align-items: center !important;
                justify-content: center !important;
                box-sizing: border-box !important;
            }
            body:has(#chat-section:not(.hidden)) .logo { display: none !important; }
            body:has(#chat-section:not(.hidden)) #site-footer { display: none !important; }
            body:has(#chat-section:not(.hidden)) #chat-section {
                width: 100% !important;
                max-width: 860px !important;
                margin: 0 auto !important;
                flex: 1 !important;
                min-height: 0 !important;
            }
            body:has(#chat-section:not(.hidden)) .chat-container {
                height: 100% !important;
                max-height: none !important;
                border-radius: 16px !important;
            }

        }



        /* ════════════════════════════════════════════════════════
           多智能体选择界面
           ════════════════════════════════════════════════════════ */
        #agent-select-section {
            width: 100%;
            max-width: 820px;
            margin: 0 auto;
            padding: 60px 20px 40px;
            box-sizing: border-box;
            text-align: center;
        }
        .agent-select-eyebrow {
            font-size: 0.78rem;
            font-weight: 600;
            letter-spacing: 0.12em;
            text-transform: uppercase;
            color: var(--accent-green);
            margin-bottom: 12px;
        }
        .agent-select-title {
            font-size: 2rem;
            font-weight: 700;
            color: #1d1d1f;
            letter-spacing: -0.5px;
            margin-bottom: 8px;
        }
        .agent-select-subtitle {
            font-size: 1rem;
            color: #86868b;
            margin-bottom: 48px;
            font-weight: 400;
        }
        .agent-cards {
            display: flex;
            flex-direction: row;
            gap: 20px;
            width: 100%;
        }
        .agent-card {
            flex: 1;
            background: rgba(255, 255, 255, 0.72);
            backdrop-filter: blur(28px) saturate(180%);
            -webkit-backdrop-filter: blur(28px) saturate(180%);
            border: 1px solid rgba(255, 255, 255, 0.65);
            border-radius: 24px;
            padding: 40px 28px 36px;
            cursor: pointer;
            text-align: center;
            transition: all 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
            box-shadow: 0 8px 32px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.8);
            user-select: none;
        }
        .agent-card:hover {
            transform: translateY(-10px) scale(1.02);
            box-shadow: 0 28px 64px rgba(0,0,0,0.14), inset 0 1px 0 rgba(255,255,255,0.9);
            background: rgba(255, 255, 255, 0.88);
            border-color: rgba(29, 29, 31, 0.25);
        }
        .agent-card:active { transform: translateY(-4px) scale(0.99); }
        .agent-card-icon {
            font-size: 3.2rem;
            margin-bottom: 18px;
            display: block;
            line-height: 1;
        }
        .agent-card-title {
            font-size: 1.35rem;
            font-weight: 700;
            color: #1d1d1f;
            margin-bottom: 10px;
            letter-spacing: -0.3px;
        }
        .agent-card-desc {
            font-size: 0.88rem;
            color: #6e6e73;
            line-height: 1.65;
            margin-bottom: 28px;
        }
        .agent-card-cta {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            background: var(--accent-light);
            color: var(--accent-green);
            font-size: 0.82rem;
            font-weight: 600;
            padding: 8px 18px;
            border-radius: 999px;
            letter-spacing: 0.02em;
            transition: background 0.2s;
        }
        .agent-card:hover .agent-card-cta {
            background: rgba(29,29,31,0.15);
        }
        .agent-select-back {
            display: inline-block;
            margin-top: 36px;
            color: var(--text-sub);
            text-decoration: none;
            font-size: 0.9rem;
            font-weight: 500;
            transition: color 0.2s;
        }
        .agent-select-back:hover { color: var(--accent-green); }

        /* 非登录区块保持居中窄版 */
        #verify-section {
            max-width: 540px;
            margin-left: auto;
            margin-right: auto;
        }
        #chat-section {
            max-width: 760px;
            width: 90%;
            margin-left: auto;
            margin-right: auto;
        }
        /* ════════════════════════════════════════════════
           表单页：body 全接管 · 左固定图 · 右原生滚动
           ════════════════════════════════════════════════ */
        body:has(#form-section:not(.hidden)) {
            overflow-y: auto;
            overflow-x: hidden;
            background-image: none;
            background-color: #ffffff;
            padding: 0;
            display: block;
        }
        body:has(#form-section:not(.hidden)) .container { display: contents; }
        body:has(#form-section:not(.hidden)) .logo,
        body:has(#form-section:not(.hidden)) #login-layout,
        body:has(#form-section:not(.hidden)) #team-intro-section,
        body:has(#form-section:not(.hidden)) #workspace-select-section,
        body:has(#form-section:not(.hidden)) #design-type-section,
        body:has(#form-section:not(.hidden)) #design-section,
        body:has(#form-section:not(.hidden)) #ad-display-section,
        body:has(#form-section:not(.hidden)) #verify-section,
        body:has(#form-section:not(.hidden)) #agent-select-section,
        body:has(#form-section:not(.hidden)) #chat-section,
        body:has(#form-section:not(.hidden)) .container > div[style*="margin-top"] { display: none !important; }

        /* ════════════════════════════════════════════════
           左侧：Aria 顾问工牌 + 聊天面板（原营销大图区域）
           ════════════════════════════════════════════════ */
        .form-left-chat {
            display: none;
            position: fixed;
            top: 0; left: 0;
            width: 50%;
            height: 100vh;
            flex-direction: column;
            box-sizing: border-box;
            z-index: 2;
            background: linear-gradient(165deg, #fbfcfb 0%, #f2f7f4 100%);
            border-right: 1px solid rgba(0,0,0,0.06);
        }
        body:has(#form-section:not(.hidden)) .form-left-chat { display: flex; }
        .form-left-chat, .form-left-chat * { pointer-events: auto; }

        .aria-mobile-toggle { display: none; }

        .aria-chat-body {
            flex: 1;
            display: flex;
            flex-direction: column;
            min-height: 0;
            padding: 40px 36px 28px;
            box-sizing: border-box;
        }

        .aria-badge-mini {
            display: flex;
            align-items: center;
            gap: 14px;
            padding-bottom: 14px;
            border-bottom: 1px solid rgba(0,0,0,0.06);
            flex-shrink: 0;
        }
        .aria-badge-mini-avatar {
            width: 56px; height: 56px; border-radius: 14px;
            background: #ffffff; border: 1px solid rgba(0,0,0,0.06);
            display: flex; align-items: center; justify-content: center;
            box-shadow: 0 4px 14px rgba(0,0,0,0.05);
            flex-shrink: 0;
        }
        .aria-badge-mini-avatar svg {
            width: 40px; height: 40px; display: block;
            image-rendering: pixelated; image-rendering: crisp-edges;
        }
        .aria-badge-mini-name {
            font-size: 1.05rem; font-weight: 800; color: #1d1d1f;
            display: flex; align-items: center; gap: 7px;
        }
        .aria-online-dot {
            width: 7px; height: 7px; border-radius: 50%;
            background: #34C759; box-shadow: 0 0 0 3px rgba(52,199,89,0.18);
            display: inline-block; flex-shrink: 0;
        }
        .aria-online-text { font-size: 0.68rem; color: #86868b; font-weight: 600; }
        .aria-badge-mini-role { font-size: 0.78rem; color: #86868b; font-weight: 600; margin-top: 3px; }
        .aria-badge-mini-desc {
            font-size: 0.84rem; color: #48484a; line-height: 1.5;
            padding: 14px 0 16px;
            flex-shrink: 0;
        }

        .aria-chat-messages {
            flex: 1;
            min-height: 0;
            overflow-y: auto;
            display: flex; flex-direction: column; gap: 10px;
            padding-right: 4px;
        }
        .aria-msg-bubble {
            max-width: 88%;
            padding: 10px 14px;
            font-size: 0.88rem;
            line-height: 1.5;
            word-wrap: break-word;
            white-space: pre-wrap;
            border-radius: 16px 16px 16px 4px;
        }
        .aria-msg-ai { align-self: flex-start; background: #F5F5F7; color: #1d1d1f; }
        .aria-msg-user { align-self: flex-end; background: var(--accent-green); color: #ffffff; border-radius: 16px 16px 4px 16px; }
        .aria-msg-typing { color: #86868b; }

        .aria-confirm-btn-wrap { align-self: flex-start; }
        .aria-confirm-btn {
            background: #1D1D1F; color: #ffffff; border: none;
            border-radius: 999px; padding: 9px 18px;
            font-size: 0.85rem; font-weight: 700; cursor: pointer;
            font-family: inherit;
            transition: all 0.2s cubic-bezier(0.2,0.8,0.2,1);
        }
        .aria-confirm-btn:hover:not(:disabled) { transform: scale(1.03); background: #000000; }
        .aria-confirm-btn:disabled { opacity: 0.6; cursor: default; transform: none; }

        .aria-chat-quick {
            display: flex; flex-wrap: wrap; gap: 6px;
            padding: 12px 0;
            flex-shrink: 0;
        }
        .aria-quick-btn {
            background: #ffffff; border: 1px solid rgba(0,0,0,0.1);
            color: #48484a; font-size: 0.76rem; font-weight: 600;
            padding: 6px 12px; border-radius: 999px;
            cursor: pointer; font-family: inherit;
            transition: all 0.2s ease;
        }
        .aria-quick-btn:hover:not(:disabled) { border-color: var(--accent-green); color: var(--accent-green); }
        .aria-quick-btn:disabled { opacity: 0.5; cursor: default; }

        .aria-chat-inputbar {
            display: flex; align-items: center; gap: 8px;
            flex-shrink: 0; padding-top: 6px;
        }
        .aria-chat-inputbar input {
            flex: 1; margin: 0; border-radius: 999px;
            padding: 11px 16px; font-size: 0.88rem;
            background: #ffffff; border: 1px solid rgba(0,0,0,0.1);
            font-family: inherit; outline: none;
            transition: border-color 0.2s;
        }
        .aria-chat-inputbar input:focus { border-color: var(--accent-green); }
        .aria-chat-inputbar input:disabled { opacity: 0.6; }
        .aria-chat-send-btn {
            width: 38px; height: 38px; border-radius: 50%; padding: 0; margin: 0; flex-shrink: 0;
            background: var(--accent-green); color: #ffffff; border: none;
            display: flex; align-items: center; justify-content: center;
            cursor: pointer;
            transition: transform 0.2s cubic-bezier(0.2,0.8,0.2,1), background 0.2s;
        }
        .aria-chat-send-btn:hover:not(:disabled) { transform: scale(1.06); background: var(--accent-green-hover); }
        .aria-chat-send-btn:disabled { opacity: 0.6; cursor: default; transform: none; }

        /* 右侧：表单区（原生页面滚动）*/
        #form-section {
            position: relative; z-index: 3;
            margin-left: 50%; width: 50%;
            min-height: 100vh;
            background: #ffffff;
            box-shadow: -1px 0 0 rgba(0,0,0,0.07);
            border-radius: 0; border: none; padding: 0;
            box-sizing: border-box;
        }
        #form-section .box-content {
            width: 100%; max-width: 100%;
            padding: 44px 56px 80px;
            box-sizing: border-box;
            text-align: left;
        }
        .form-page-title {
            font-size: 2.2rem; font-weight: 700;
            letter-spacing: -0.5px; color: #000000;
            margin: 0 0 8px;
        }
        .form-page-sub {
            font-size: 0.95rem; color: #AEAEB2;
            margin: 0 0 16px; line-height: 1.6;
        }
        .form-page-head {
            display: flex; align-items: flex-start; justify-content: space-between;
            gap: 16px; margin-bottom: 20px;
            flex-wrap: wrap;
        }
        .form-page-head-text { flex: 1; min-width: 200px; }
        .form-page-head .form-page-title { margin-bottom: 8px; }
        .form-page-head .form-page-sub { margin-bottom: 0; }
        .form-brief-guide-btn {
            appearance: none; -webkit-appearance: none;
            border: 1px solid rgba(0,0,0,0.14);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.88rem; font-weight: 700;
            padding: 9px 14px; border-radius: 999px; cursor: pointer;
            flex-shrink: 0; white-space: nowrap;
            transition: background 0.15s ease, border-color 0.15s ease;
        }
        .form-brief-guide-btn:hover { background: #f5f5f7; border-color: rgba(0,0,0,0.28); }

        /* 策划表单 · 填写说明弹层（仅表单页，不锁 body overflow） */
        #form-brief-guide-modal {
            display: none;
            position: fixed; inset: 0; z-index: 10050;
            align-items: center; justify-content: center;
            padding: 20px 16px;
            box-sizing: border-box;
            pointer-events: none;
        }
        #form-brief-guide-modal.open {
            display: flex;
            pointer-events: auto;
        }
        .form-brief-guide-backdrop {
            position: absolute; inset: 0;
            background: rgba(0,0,0,0.4);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
        }
        .form-brief-guide-panel {
            position: relative; z-index: 1;
            width: min(620px, 96vw);
            max-height: min(90dvh, 900px);
            background: #fff;
            border-radius: 22px;
            box-shadow: 0 28px 80px rgba(0,0,0,0.2);
            display: flex; flex-direction: column;
            overflow: hidden;
            text-align: left;
        }
        .form-brief-guide-header {
            display: flex; align-items: center; justify-content: space-between;
            gap: 12px; padding: 16px 22px 14px;
            border-bottom: 1px solid rgba(0,0,0,0.06);
            flex-shrink: 0;
            background: #fff;
        }
        .form-brief-guide-title {
            margin: 0;
            font-size: 1.12rem; font-weight: 800; color: #1d1d1f;
            letter-spacing: -0.02em;
        }
        .form-brief-guide-x {
            appearance: none; border: none;
            width: 36px; height: 36px; border-radius: 50%;
            background: #f5f5f7; color: #6e6e73;
            font-size: 1.35rem; line-height: 1; cursor: pointer;
            font-family: inherit;
        }
        .form-brief-guide-x:hover { background: #ebebed; color: #1d1d1f; }
        .form-brief-guide-body {
            flex: 1; min-height: 0;
            overflow-y: auto;
            padding: 16px 18px 10px;
            box-sizing: border-box;
            -webkit-overflow-scrolling: touch;
            display: flex; flex-direction: column; gap: 12px;
            background: #f5f5f7;
        }
        .fbg-card {
            background: #fff;
            border: 1px solid rgba(0,0,0,0.06);
            border-radius: 16px;
            padding: 14px 16px 14px;
            box-shadow: 0 4px 14px rgba(29,29,31,0.03);
        }
        .fbg-card h3 {
            margin: 0 0 10px;
            font-size: 0.98rem; font-weight: 800; color: #1d1d1f;
            letter-spacing: -0.01em;
        }
        .fbg-card p {
            margin: 0 0 8px;
            font-size: 0.88rem; line-height: 1.55; color: #48484a;
        }
        .fbg-card p:last-child { margin-bottom: 0; }
        .fbg-card-gigo {
            background: linear-gradient(165deg, #fff8f2 0%, #fff4ea 100%);
            border-color: rgba(178, 106, 0, 0.16);
        }
        .fbg-card-gigo h3 { color: #8A5A00; }
        .fbg-contrast {
            display: flex; flex-direction: column; gap: 8px;
            margin: 0 0 12px;
        }
        .fbg-contrast-item {
            display: flex; align-items: flex-start; gap: 8px;
            padding: 9px 11px;
            border-radius: 12px;
            font-size: 0.86rem; line-height: 1.45; font-weight: 600;
        }
        .fbg-contrast-item.good {
            background: rgba(52,199,89,0.1);
            color: #1a7a3a;
        }
        .fbg-contrast-item.bad {
            background: rgba(255,59,48,0.08);
            color: #b42318;
        }
        .fbg-contrast-mark {
            flex-shrink: 0;
            width: 18px; height: 18px; margin-top: 1px;
            border-radius: 50%;
            display: inline-flex; align-items: center; justify-content: center;
            font-size: 0.72rem; font-weight: 800;
            background: rgba(255,255,255,0.7);
        }
        .fbg-highlight {
            margin: 0 0 8px !important;
            font-size: 0.95rem !important;
            font-weight: 800 !important;
            color: #1d1d1f !important;
            line-height: 1.45 !important;
        }
        .fbg-note {
            margin: 0 !important;
            font-size: 0.82rem !important;
            color: #6e6e73 !important;
            line-height: 1.5 !important;
        }
        .fbg-steps {
            display: grid;
            grid-template-columns: repeat(5, minmax(0, 1fr));
            gap: 8px;
            margin: 0 0 10px;
        }
        .fbg-step {
            background: #f5f5f7;
            border-radius: 12px;
            padding: 10px 8px;
            text-align: center;
            min-width: 0;
        }
        .fbg-step-num {
            display: block;
            font-size: 0.72rem; font-weight: 800; color: #aeaeb2;
            margin-bottom: 4px; letter-spacing: 0.04em;
        }
        .fbg-step-label {
            display: block;
            font-size: 0.8rem; font-weight: 700; color: #1d1d1f;
            line-height: 1.3;
            word-break: break-word;
        }
        .fbg-grid4 {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }
        .fbg-chip {
            background: #f5f5f7;
            border-radius: 12px;
            padding: 10px 12px;
        }
        .fbg-chip strong {
            display: block;
            font-size: 0.88rem; font-weight: 800; color: #1d1d1f;
            margin-bottom: 3px;
        }
        .fbg-chip span {
            display: block;
            font-size: 0.8rem; line-height: 1.4; color: #6e6e73;
        }
        .fbg-adj-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 0.82rem;
            margin: 0 0 10px;
        }
        .fbg-adj-table th,
        .fbg-adj-table td {
            padding: 8px 10px;
            border-bottom: 1px solid rgba(0,0,0,0.06);
            text-align: left;
            vertical-align: top;
            line-height: 1.4;
        }
        .fbg-adj-table th {
            font-size: 0.74rem; font-weight: 700; color: #86868b;
            background: #fafafa;
        }
        .fbg-adj-table td:first-child {
            font-weight: 800; color: #1d1d1f; white-space: nowrap;
            width: 18%;
        }
        .fbg-adj-table td { color: #48484a; }
        .fbg-remember {
            margin: 0;
            padding: 0;
            list-style: none;
            display: flex; flex-direction: column; gap: 7px;
        }
        .fbg-remember li {
            position: relative;
            padding-left: 16px;
            font-size: 0.86rem; line-height: 1.45; color: #48484a; font-weight: 600;
        }
        .fbg-remember li::before {
            content: '';
            position: absolute; left: 0; top: 0.55em;
            width: 6px; height: 6px; border-radius: 50%;
            background: #1d1d1f;
        }
        .form-brief-guide-footer {
            display: flex; align-items: center; gap: 10px;
            padding: 12px 18px 16px;
            border-top: 1px solid rgba(0,0,0,0.06);
            flex-shrink: 0;
            background: #fff;
        }
        .form-brief-guide-hide {
            appearance: none;
            flex: 0 0 auto;
            min-height: 46px; padding: 0 16px; border-radius: 12px;
            border: 1.5px solid rgba(0,0,0,0.18);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.9rem; font-weight: 600;
            cursor: pointer;
            white-space: nowrap;
        }
        .form-brief-guide-hide:hover { background: #f5f5f7; border-color: rgba(0,0,0,0.3); }
        .form-brief-guide-ok {
            appearance: none; border: none;
            flex: 1 1 auto;
            min-height: 46px; padding: 0 20px; border-radius: 12px;
            background: #1d1d1f; color: #fff;
            font-family: inherit; font-size: 0.95rem; font-weight: 700;
            cursor: pointer;
        }
        .form-brief-guide-ok:hover { background: #000; }
        @media (max-width: 720px) {
            #form-brief-guide-modal { padding: 10px 10px 12px; align-items: flex-end; }
            .form-brief-guide-panel {
                width: 100%;
                max-height: 92dvh;
                border-radius: 18px 18px 14px 14px;
            }
            .form-brief-guide-body { padding: 12px 12px 8px; gap: 10px; }
            .fbg-card { padding: 12px 12px; border-radius: 14px; }
            .fbg-steps {
                grid-template-columns: 1fr;
                gap: 6px;
            }
            .fbg-step {
                display: flex; align-items: center; gap: 10px;
                text-align: left; padding: 8px 10px;
            }
            .fbg-step-num { margin-bottom: 0; min-width: 1.4em; }
            .fbg-grid4 { grid-template-columns: 1fr; }
            .fbg-adj-table th:nth-child(2),
            .fbg-adj-table td:nth-child(2) { display: none; }
            .form-brief-guide-footer { padding: 10px 12px 14px; gap: 8px; }
            .form-brief-guide-hide { padding: 0 12px; font-size: 0.86rem; }
        }
        @media (min-width: 721px) and (max-width: 900px) {
            .fbg-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
            .fbg-step-label { font-size: 0.74rem; }
        }

        #form-section #user-info-bar {
            background: #F5F5F7; border: none;
            border-radius: 12px; margin-bottom: 32px;
            padding: 14px 18px; font-size: 0.9rem;
        }
        .form-group { margin-bottom: 28px; }
        .form-group label {
            display: block;
            font-size: 1.1rem; font-weight: 600;
            color: #1D1D1F; letter-spacing: 0.01em;
            margin-bottom: 12px; margin-top: 0;
            text-align: left;
        }
        .form-group label.required::after {
            content: " ·"; color: #D1D1D6; font-weight: 700; font-size: 1.1em;
        }
        .form-group input,
        .form-group textarea,
        .form-group select {
            width: 100%; box-sizing: border-box;
            border: 1px solid rgba(0,0,0,0.08); border-radius: 12px;
            background: rgba(250,250,252,0.9);
            padding: 14px 16px; font-size: 1rem;
            color: #1D1D1F; font-family: inherit;
            transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
            outline: none; -webkit-appearance: none; appearance: none; line-height: 1.5;
        }
        .form-group input:focus,
        .form-group textarea:focus,
        .form-group select:focus {
            border-color: rgba(0,0,0,0.2); background: #ffffff;
            box-shadow: 0 0 0 3px rgba(0,0,0,0.04); transform: none;
        }
        .form-group input::placeholder,
        .form-group textarea::placeholder { color: #C7C7CC; }
        .form-group textarea { resize: vertical; min-height: 96px; max-height: 280px; line-height: 1.65; }
        .form-group select {
            cursor: pointer;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23AEAEB2' d='M5 6L0 0h10z'/%3E%3C/svg%3E");
            background-repeat: no-repeat; background-position: right 14px center;
            background-color: rgba(250,250,252,0.9); padding-right: 36px;
        }
        #planVersion option[disabled],
        #planVersion option.plan-option-disabled {
            color: #aeaeb2;
            background: #f5f5f7;
        }
        #form-section #start-btn {
            width: 100%; margin-top: 8px; border-radius: 12px;
            padding: 16px; font-size: 0.975rem; font-weight: 600;
        }
        #form-section #status-msg { margin-top: 20px; }
        #form-section .back-link-wrap { margin-top: 20px; text-align: left; }
        #form-section #abort-btn {
            width: 100%; border-radius: 12px; padding: 14px 16px;
            font-size: 0.95rem; font-weight: 600; box-sizing: border-box;
        }

        /* 展开按钮 */
        .expand-hint {
            float: right;
            display: inline-flex; align-items: center; gap: 5px;
            cursor: pointer; user-select: none;
            font-size: 0.95rem; font-weight: 600;
            color: #1D1D1F; letter-spacing: 0;
            opacity: 0.8;
            transition: opacity 0.2s;
        }
        .expand-hint:hover { opacity: 1; }
        .expand-btn {
            background: none; border: none; cursor: pointer;
            font-size: 1.15rem; color: #1D1D1F;
            padding: 0; line-height: 1;
            font-weight: 400;
        }
        /* ── 大纲审核弹窗 ── */
        #outline-review-modal {
            display: none;
            position: fixed; inset: 0; z-index: 10000;
            background: rgba(0,0,0,0.45);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            align-items: center; justify-content: center;
            padding: 16px; box-sizing: border-box;
        }
        #outline-review-modal.open { display: flex; }
        .outline-panel {
            width: 100%; max-width: 960px;
            height: 88dvh; max-height: 95dvh;
            background: rgba(255,255,255,0.92);
            backdrop-filter: blur(24px) saturate(180%);
            -webkit-backdrop-filter: blur(24px) saturate(180%);
            border: 1px solid rgba(255,255,255,0.7);
            border-radius: 24px;
            box-shadow: 0 32px 80px rgba(0,0,0,0.28), inset 0 1px 0 rgba(255,255,255,0.9);
            display: flex; flex-direction: column;
            overflow: hidden;
            animation: panel-in 0.32s cubic-bezier(0.2,0.8,0.2,1) both;
        }
        @keyframes panel-in {
            from { opacity:0; transform: scale(0.94) translateY(12px); }
            to   { opacity:1; transform: scale(1)    translateY(0); }
        }
        .outline-panel-header {
            padding: 20px 28px 0;
            flex-shrink: 0;
        }
        .outline-panel-eyebrow {
            font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em;
            text-transform: uppercase; color: var(--accent-green); margin-bottom: 4px;
        }
        .outline-panel-title {
            font-size: 1.25rem; font-weight: 700; color: #1d1d1f;
            letter-spacing: -0.3px; margin-bottom: 4px;
        }
        .outline-panel-hint {
            font-size: 0.82rem; color: #86868b; margin-bottom: 16px;
        }
        .outline-textarea {
            flex: 1; min-height: 200px;
            margin: 0 28px;
            padding: 16px 18px;
            font-size: 0.95rem; line-height: 1.7;
            font-family: inherit; color: #1d1d1f;
            background: #ffffff;
            border: 1px solid rgba(0,0,0,0.08);
            border-radius: 14px;
            resize: none; outline: none;
            box-sizing: border-box;
            cursor: default;
        }
        .outline-textarea:focus { border-color: rgba(0,0,0,0.08); box-shadow: none; background: #ffffff; }
        .markdown-body { font-size: 0.95rem; line-height: 1.7; color: #1d1d1f; }
        .markdown-body h1, .markdown-body h2, .markdown-body h3 { margin-top: 1.2em; margin-bottom: 0.6em; font-weight: 700; color: #000; }
        .markdown-body h1 { font-size: 1.4rem; }
        .markdown-body h2 { font-size: 1.2rem; }
        .markdown-body h3 { font-size: 1.05rem; }
        .markdown-body p { margin-bottom: 1em; }
        .markdown-body ul, .markdown-body ol { padding-left: 24px; margin-bottom: 1em; }
        .markdown-body li { margin-bottom: 4px; }
        .markdown-body strong { font-weight: 700; color: #1D1D1F; }
        /* --- 全屏阅读器专属大字号沉浸排版 --- */
        #outline-fullscreen-render {
            font-size: 1.15rem !important;
            line-height: 1.9 !important;
            padding: 50px 80px !important;
        }
        #outline-fullscreen-render h1 { font-size: 1.8rem; margin-top: 1.2em; }
        #outline-fullscreen-render h2 { font-size: 1.5rem; margin-top: 1.2em; }
        #outline-fullscreen-render h3 { font-size: 1.25rem; margin-top: 1.2em; }
        #outline-fullscreen-render li { margin-bottom: 10px; }
        @media (max-width: 768px) {
            #outline-fullscreen-render {
                padding: 24px 20px !important;
                font-size: 1.05rem !important;
            }
        }
        /* 反馈输入框 */
        #feedback-input:focus {
            border-color: var(--accent-green) !important;
            box-shadow: 0 0 0 3px var(--accent-light) !important;
            background: #ffffff !important;
        }
        .outline-panel-footer {
            display: flex; gap: 12px;
            padding: 20px 28px 24px;
            flex-shrink: 0;
        }
        .outline-btn-approve {
            flex: 1; padding: 15px 20px;
            background: var(--accent-green); color: #fff;
            border: none; border-radius: 14px;
            font-size: 1rem; font-weight: 700;
            cursor: pointer; font-family: inherit;
            transition: all 0.2s cubic-bezier(0.2,0.8,0.2,1);
        }
        .outline-btn-approve:hover { background: var(--accent-green-hover); transform: scale(1.02); }
        .outline-btn-approve:active { transform: scale(0.97); }
        .outline-btn-revise {
            flex: 1; padding: 15px 20px;
            background: transparent; color: #6e6e73;
            border: 1px solid rgba(0,0,0,0.18); border-radius: 14px;
            font-size: 1rem; font-weight: 600;
            cursor: pointer; font-family: inherit;
            transition: all 0.2s cubic-bezier(0.2,0.8,0.2,1);
        }
        .outline-btn-revise:hover:not(:disabled) { background: rgba(0,0,0,0.05); border-color: rgba(0,0,0,0.28); }
        .outline-btn-revise:active:not(:disabled) { transform: scale(0.97); }
        .outline-btn-revise:disabled {
            opacity: 0.42; cursor: not-allowed;
            border-style: dashed;
        }
        @media (max-width: 600px) {
            .outline-panel-footer { flex-direction: column; }
            .outline-panel-header { padding: 18px 20px 0; }
            .outline-textarea { margin: 0 20px; }
        }

        #fullscreen-editor { display: none; }
        #fullscreen-editor.open { display: flex; }

        @media (max-width: 768px) {
            .form-left-chat {
                position: static;
                width: 100%;
                height: auto;
                border-right: none;
                border-bottom: 1px solid rgba(0,0,0,0.08);
            }
            .aria-mobile-toggle {
                display: flex; align-items: center; justify-content: space-between;
                padding: 14px 20px; background: #ffffff;
                font-size: 0.9rem; font-weight: 700; color: #1d1d1f;
                border: none; width: 100%; cursor: pointer; font-family: inherit;
                flex-shrink: 0; box-sizing: border-box;
            }
            .aria-mobile-toggle-arrow { transition: transform 0.25s ease; color: #86868b; font-weight: 400; }
            .form-left-chat.is-collapsed .aria-mobile-toggle-arrow { transform: rotate(-90deg); }
            .form-left-chat .aria-chat-body,
            .form-left-chat .npc-workbench { max-height: 46vh; }
            .form-left-chat.is-collapsed .aria-chat-body,
            .form-left-chat.is-collapsed .npc-workbench { display: none; }
            .npc-badge-scene, .npc-badge-scene .agent-badge-flip { width: 230px; min-height: 300px; }
            #form-section { margin-left: 0; width: 100%; box-shadow: none; }
            #form-section .box-content { padding: 48px 24px 80px; max-width: 100%; }
        }



        /* --- 动态大标题 (Logo) --- */
        .logo { 
            font-size: 6rem;
            font-weight: 700;
            letter-spacing: -0.03em; 
            margin-bottom: 24px; 
            color: var(--text-main); 
            text-shadow: none;
        }

        /* --- 登录框内品牌标题 --- */
        .login-brand-title {
            font-weight: 600;
            font-size: 3rem;
            letter-spacing: -0.5px;
            color: var(--text-main);
            text-align: center;
            margin-bottom: 0;
            margin-top: -8px;
        }

        /* --- Slogan --- */
        .slogan-container { text-align: center; margin-bottom: 0; }
        .slogan-main { color: #999999; font-size: 0.95rem; font-weight: 400; margin-bottom: 0; letter-spacing: 0.02em; }
        .slogan-sub { color: var(--text-sub); font-size: 1.15rem; line-height: 1.6; font-weight: 400; }

        /* --- 核心卡片容器 --- */
        .box { 
            background: var(--card-bg); 
            backdrop-filter: blur(24px); 
            -webkit-backdrop-filter: blur(24px);
            border-radius: 24px; 
            box-shadow: var(--shadow-sm); 
            border: 1px solid rgba(255, 255, 255, 0.6); 
            text-align: left; 
            overflow: hidden; 
            transition: transform 0.4s var(--ease-apple), box-shadow 0.4s var(--ease-apple);
            margin-bottom: 30px;
        }

        .box:hover {
            transform: translateY(-4px); 
            box-shadow: var(--shadow-lg);
        }

        .box-content { padding: 40px; } 
        .hidden { display: none !important; }

        /* ========================================================
           ✨ 优化痛点：抗疲劳的表单设计
           ======================================================== */
        label { 
            display: block; margin-bottom: 8px; font-weight: 600; font-size: 0.9rem; 
            color: var(--text-sub); margin-top: 24px; letter-spacing: 0.02em;
        }
        label:first-child { margin-top: 0; }
        
        input, textarea, select { 
            width: 100%; 
            padding: 16px; 
            border: 1px solid rgba(0, 0, 0, 0.15); 
            border-radius: 14px; 
            box-sizing: border-box; 
            background: rgba(255, 255, 255, 0.9); 
            font-family: inherit; 
            font-size: 1.1rem; 
            color: var(--text-main);
            transition: border-color 0.3s var(--ease-apple), box-shadow 0.3s var(--ease-apple), background 0.3s var(--ease-apple); 
        }
        input::placeholder, textarea::placeholder { color: #A1A1A6; }
        
        /* 选中时的清晰反馈 */
        input:focus, textarea:focus, select:focus { 
            border-color: var(--accent-green); 
            outline: none; 
            background: #ffffff; 
            box-shadow: 0 4px 16px var(--accent-light); 
        }
        
        input:-webkit-autofill { -webkit-box-shadow: 0 0 0 30px #ffffff inset !important; }

        /* --- 按钮系统 --- */
        .btn { 
            width: 100%; padding: 18px 24px; 
            background: var(--accent-green); color: white; 
            border: none; border-radius: 14px; 
            font-weight: 700; cursor: pointer; margin-top: 32px; font-size: 1.1rem; 
            text-align: center; display: block;
            transition: all 0.2s cubic-bezier(0.2, 0.8, 0.2, 1); 
        }
        .btn:hover { background: var(--accent-green-hover); transform: scale(1.02); box-shadow: 0 8px 24px var(--accent-light); }
        .btn:active { transform: scale(0.95); }
        .btn:disabled { background: #D2D2D7; color: #ffffff; cursor: not-allowed; transform: none; box-shadow: none; }
        
        .btn-outline { 
            background: transparent; color: var(--accent-green); 
            border: 1px solid rgba(29, 29, 31, 0.4); margin-top: 16px; 
        }
        .btn-outline:hover { background: var(--accent-light); color: var(--accent-green); border-color: var(--accent-green); transform: scale(1.02); }
        .btn-outline:active { transform: scale(0.98); }

        /* --- 用户信息条 --- */
        #user-info-bar { 
            background: rgba(245, 245, 247, 0.8); padding: 16px 20px; border-radius: 14px; 
            margin-bottom: 30px; font-size: 0.9rem; color: var(--text-main); 
            display: flex; justify-content: space-between; align-items: center; 
            flex-wrap: wrap; gap: 10px; font-weight: 500;
            border: 1px solid rgba(0,0,0,0.05);
        }
        .balance-highlight { color: var(--accent-green); font-weight: 700; font-family: -apple-system, monospace; font-size: 1.15rem; }
        #status-msg {
            margin-top: 24px; text-align: center; font-size: 0.95rem;
            color: var(--text-sub); line-height: 1.6;
            padding: 18px 24px; border-radius: 16px; display: none;
            background: rgba(255,255,255,0.68);
            backdrop-filter: blur(16px) saturate(160%);
            -webkit-backdrop-filter: blur(16px) saturate(160%);
            border: 1px solid rgba(255,255,255,0.55);
            box-shadow: 0 4px 20px rgba(0,0,0,0.06);
            transition: opacity 0.28s ease;
        }
        #status-msg.status-loading { animation: status-breathe 2.8s ease-in-out infinite; }
        #status-msg.status-fading  { opacity: 0; }
        .status-progress-wrap { margin-bottom: 14px; text-align: left; }
        .status-progress-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; font-size: 0.82rem; color: var(--text-sub); }
        .status-progress-pct { font-weight: 700; color: #1D1D1F; font-variant-numeric: tabular-nums; }
        .status-progress-track { width: 100%; height: 8px; background: rgba(0,0,0,0.08); border-radius: 999px; overflow: hidden; }
        .status-progress-fill { height: 100%; background: #1D1D1F; border-radius: 999px; width: 0%; transition: width 0.6s cubic-bezier(0.2, 0.8, 0.2, 1); }
        .status-progress-text { font-size: 0.92rem; line-height: 1.5; color: var(--text-sub); text-align: left; }
        @media (max-width: 600px) {
            .status-progress-track { height: 6px; }
            .status-progress-header { font-size: 0.78rem; }
        }
        .preview-actions {
            display: flex; flex-direction: column; gap: 10px;
            justify-content: flex-start; align-items: stretch;
            margin-top: 16px; margin-bottom: 4px;
            width: 100%;
        }
        .preview-actions.hidden { display: none !important; }
        .preview-btn {
            width: 100%; box-sizing: border-box;
            padding: 15px 20px;
            background: #1D1D1F; color: #fff;
            border: none; border-radius: 12px;
            font-size: 0.975rem; font-weight: 600;
            cursor: pointer; font-family: inherit;
            text-align: center;
            transition: all 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
            box-shadow: 0 4px 14px rgba(29,29,31,0.18);
        }
        .preview-btn:hover { background: #000; transform: scale(1.01); box-shadow: 0 6px 20px rgba(29,29,31,0.22); }
        .preview-btn.hidden { display: none !important; }

        /* 方案下载：与主按钮同宽同风格 */
        a.download-link {
            display: block !important; width: 100%; box-sizing: border-box;
            padding: 15px 20px !important;
            background: #1D1D1F !important; color: #fff !important;
            text-decoration: none !important; text-align: center;
            border-radius: 12px !important; font-weight: 600 !important;
            font-size: 0.975rem; margin-top: 14px !important;
            box-shadow: 0 4px 14px rgba(29,29,31,0.18);
            transition: all 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        a.download-link:hover { background: #000 !important; transform: scale(1.01); }
        #research-fullscreen-render { white-space: pre-wrap; word-wrap: break-word; }
        @media (max-width: 768px) {
            #research-fullscreen-render {
                padding: 24px 20px !important;
                font-size: 1.05rem !important;
            }
        }

        /* --- 6 人协作工牌 --- */
        .agent-collab-area {
            display: flex; flex-direction: column; align-items: stretch;
            margin-top: 20px; margin-bottom: 8px;
            width: 100%;
        }
        .agent-collab-area.hidden { display: none !important; }
        .agent-lanyard {
            width: 5px; height: 32px; background: #1D1D1F;
            margin: 0 auto -2px; border-radius: 3px 3px 0 0;
        }
        .agent-badge-scene { perspective: 900px; width: 250px; }
        .agent-badge-flip {
            position: relative; width: 250px; min-height: 330px;
            transform-style: preserve-3d;
            transition: transform 0.55s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.2s;
            cursor: pointer;
        }
        .agent-badge-flip:hover:not(.flipped) { transform: translateY(-4px); }
        .agent-badge-flip.flipped { transform: rotateY(180deg); }
        .agent-badge-flip.flipped:hover { transform: translateY(-4px) rotateY(180deg); }
        .agent-badge-front, .agent-badge-back {
            position: absolute; inset: 0; backface-visibility: hidden;
            border-radius: 16px; background: #ffffff;
            box-shadow: 0 10px 36px rgba(29, 29, 31, 0.12), 0 2px 8px rgba(0,0,0,0.04);
            overflow: hidden; display: flex; flex-direction: column;
        }
        .agent-badge-back { transform: rotateY(180deg); padding: 0; box-sizing: border-box; }
        .agent-badge-namebar {
            background: #1D1D1F; color: #fff; text-align: center;
            padding: 10px 12px; font-size: 1.05rem; font-weight: 700; letter-spacing: 0.02em;
            flex-shrink: 0;
        }
        .agent-badge-back-body {
            flex: 1; overflow-y: auto; padding: 14px 16px 16px; box-sizing: border-box;
            text-align: left;
        }
        .agent-badge-body { padding: 14px 16px 12px; flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
        .agent-badge-avatar-wrap {
            width: 72px; height: 72px; border-radius: 14px;
            background: #f5f5f7; display: flex; align-items: center; justify-content: center;
            margin-bottom: 10px;
        }
        .agent-badge-avatar {
            width: 48px; height: 48px;
            background: transparent; border-radius: 0;
            display: flex; align-items: center; justify-content: center;
            overflow: hidden;
        }
        .agent-badge-avatar svg {
            width: 48px; height: 48px; display: block;
            image-rendering: pixelated;
            image-rendering: crisp-edges;
        }
        .agent-badge-role-cn { font-size: 0.95rem; font-weight: 700; color: #1d1d1f; margin-bottom: 2px; }
        .agent-badge-role-en { font-size: 0.72rem; color: #86868b; margin-bottom: 10px; }
        .agent-badge-motto { font-size: 0.82rem; line-height: 1.55; color: #48484a; margin-bottom: 12px; min-height: 2.8em; }
        .agent-badge-status {
            font-size: 0.78rem; font-weight: 600; color: #1D1D1F;
            background: rgba(29, 29, 31, 0.08); padding: 4px 12px; border-radius: 999px;
        }
        .agent-badge-footer {
            display: flex; justify-content: space-between; align-items: center;
            padding: 10px 16px; border-top: 1px solid rgba(0,0,0,0.05);
            font-size: 0.75rem; color: #86868b;
        }
        .agent-badge-detail-btn { color: #1D1D1F; font-weight: 700; font-size: 0.78rem; }
        .agent-badge-about { font-size: 0.82rem; line-height: 1.6; color: #48484a; margin-bottom: 12px; }
        .agent-badge-duties { margin: 0; padding-left: 18px; font-size: 0.78rem; line-height: 1.65; color: #48484a; text-align: left; }
        .agent-badge-duties li { margin-bottom: 4px; }
        .agent-dots {
            display: flex; justify-content: space-between; align-items: flex-start;
            gap: 8px; margin-top: 4px; flex-wrap: nowrap;
            width: 100%; max-width: none;
        }
        .agent-dot {
            display: flex; flex-direction: column; align-items: center; gap: 8px;
            flex: 1 1 0; min-width: 0; width: auto;
        }
        .agent-dot-avatar {
            position: relative;
            width: 72px; height: 72px; border-radius: 18px;
            background: #f5f5f7;
            display: flex; align-items: center; justify-content: center;
            overflow: hidden;
            transition: all 0.3s ease;
        }
        .agent-dot-avatar svg { width: 52px; height: 52px; display: block; image-rendering: pixelated; image-rendering: crisp-edges; opacity: 0.45; transition: opacity 0.3s ease; }
        .agent-dot-name { font-size: 0.82rem; font-weight: 600; color: #86868b; }
        .agent-dot-state { font-size: 0.7rem; color: #aeaeb2; }
        .agent-dot.done .agent-dot-avatar { background: rgba(29,29,31,0.06); }
        .agent-dot.done .agent-dot-avatar svg { opacity: 1; }
        .agent-dot.done .agent-dot-name { color: #1d1d1f; }
        .agent-dot.done .agent-dot-state { color: #6e6e73; }
        .agent-dot-check {
            position: absolute; right: -3px; bottom: -3px;
            width: 20px; height: 20px; border-radius: 50%;
            background: #1D1D1F; border: 2px solid #fff;
            display: flex; align-items: center; justify-content: center;
        }
        .agent-dot-check svg { width: 11px; height: 11px; opacity: 1 !important; }
        .agent-dot.active .agent-dot-avatar {
            background: #ffffff;
            border: 2.5px solid #1D1D1F;
            animation: agentDotActivePulse 1.6s ease-in-out infinite;
        }
        .agent-dot.active .agent-dot-avatar svg { opacity: 1; }
        .agent-dot.active .agent-dot-name { color: #1d1d1f; font-weight: 700; }
        .agent-dot.active .agent-dot-state { color: #1F9D55; font-weight: 700; }
        @keyframes agentDotActivePulse {
            0%, 100% { box-shadow: 0 0 0 3px rgba(29,29,31,0.14); }
            50%      { box-shadow: 0 0 0 7px rgba(29,29,31,0.04); }
        }
        @media (max-width: 600px) {
            .agent-badge-scene, .agent-badge-flip { width: 240px; min-height: 310px; }
            .agent-dots { flex-wrap: wrap; justify-content: space-between; gap: 12px 6px; }
            .agent-dot { flex: 0 0 calc(33.333% - 6px); }
            .agent-dot-avatar { width: 56px; height: 56px; border-radius: 14px; }
            .agent-dot-avatar svg { width: 40px; height: 40px; }
        }

        /* --- 右栏：六人阶段条 + 当前任务卡（全宽，与主按钮两侧对齐） --- */
        .agent-task-card {
            width: 100%; max-width: none;
            background: #ffffff;
            border: 1px solid rgba(0,0,0,0.06);
            border-radius: 16px;
            box-shadow: 0 10px 30px rgba(29,29,31,0.07), 0 2px 8px rgba(0,0,0,0.03);
            padding: 20px 22px;
            margin-top: 22px;
            display: flex; align-items: flex-start; gap: 16px;
            text-align: left;
            box-sizing: border-box;
        }
        .agent-task-card-avatar {
            width: 60px; height: 60px; border-radius: 14px;
            background: #f5f5f7; flex-shrink: 0;
            display: flex; align-items: center; justify-content: center;
            overflow: hidden;
        }
        .agent-task-card-avatar svg { width: 44px; height: 44px; display: block; image-rendering: pixelated; image-rendering: crisp-edges; }
        .agent-task-card-body { flex: 1; min-width: 0; }
        .agent-task-card-toprow { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
        .agent-task-card-name { font-size: 1.05rem; font-weight: 700; color: #1d1d1f; }
        .agent-task-card-tag {
            font-size: 0.76rem; font-weight: 700; color: #1F9D55;
            background: rgba(52, 199, 89, 0.12); padding: 4px 12px; border-radius: 999px;
            flex-shrink: 0; white-space: nowrap;
        }
        .agent-task-card-desc { font-size: 0.9rem; color: #6e6e73; line-height: 1.55; }

        /* ════════════════════════════════════════════════
           左栏：NPC 工作台（生成中状态，取代 Aria 聊天）
           ════════════════════════════════════════════════ */
        .npc-workbench {
            position: relative;
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            min-height: 0;
            padding: 36px 36px 40px;
            box-sizing: border-box;
            gap: 18px;
            overflow-y: auto;
            isolation: isolate;
        }
        /* 工作台氛围底图：淡网格 + 绿色光晕，呼应登录页 */
        .npc-workbench::before {
            content: '';
            position: absolute; inset: 0; z-index: 0; pointer-events: none;
            background-image:
                linear-gradient(rgba(29,29,31,0.035) 1px, transparent 1px),
                linear-gradient(90deg, rgba(29,29,31,0.035) 1px, transparent 1px);
            background-size: 36px 36px;
            mask-image: radial-gradient(ellipse 70% 65% at 50% 42%, #000 35%, transparent 100%);
            -webkit-mask-image: radial-gradient(ellipse 70% 65% at 50% 42%, #000 35%, transparent 100%);
        }
        .npc-workbench::after {
            content: '';
            position: absolute; z-index: 0; pointer-events: none;
            width: 280px; height: 280px; border-radius: 50%;
            top: 8%; left: 50%; transform: translateX(-50%);
            background: radial-gradient(circle, rgba(var(--green-rgb), 0.16) 0%, rgba(var(--green-rgb), 0.04) 45%, transparent 70%);
            filter: blur(8px);
        }
        .npc-workbench > * { position: relative; z-index: 1; }

        /* 顶部品牌区：ANJI LOGO + 工作台标题 */
        .npc-workbench-brand {
            display: flex; flex-direction: column; align-items: center;
            text-align: center; margin-bottom: 4px;
        }
        .npc-workbench-letters {
            display: flex; gap: 0.04em; justify-content: center;
            font-size: clamp(2.6rem, 5.2vw, 3.4rem);
            font-weight: 800; letter-spacing: -0.03em;
            color: #1d1d1f; line-height: 0.92;
            perspective: 500px;
        }
        .npc-workbench-letters span {
            display: inline-block;
            opacity: 0; transform: translateY(12px);
            animation: loginLetterIn 0.55s cubic-bezier(0.16, 1, 0.3, 1) forwards;
            animation-delay: calc(var(--i) * 0.08s + 0.1s);
        }
        .npc-workbench-en {
            margin-top: 8px;
            font-size: 0.72rem; font-weight: 700; letter-spacing: 0.22em;
            color: rgba(var(--green-rgb), 0.7); text-transform: uppercase;
        }
        .npc-workbench-title {
            margin-top: 14px;
            font-size: clamp(1.15rem, 2vw, 1.35rem);
            font-weight: 800; color: #1d1d1f;
            letter-spacing: 0.02em;
        }
        .npc-workbench-title-sub {
            margin-top: 6px;
            font-size: 0.82rem; color: #86868b; font-weight: 500;
        }
        .npc-workbench-stage { display: flex; flex-direction: column; align-items: center; }
        .npc-badge-scene { width: 300px; }
        .npc-badge-scene .agent-badge-flip { width: 300px; min-height: 392px; }
        .npc-badge-scene .agent-badge-avatar-wrap { width: 84px; height: 84px; }
        .npc-badge-scene .agent-badge-avatar,
        .npc-badge-scene .agent-badge-avatar svg { width: 56px; height: 56px; }

        /* 切换 NPC 时的淡入 + 轻上移 */
        @keyframes npcBadgeSwitch {
            0%   { opacity: 0; transform: translateY(10px); }
            100% { opacity: 1; transform: translateY(0); }
        }
        .npc-badge-scene.npc-switch-anim { animation: npcBadgeSwitch 0.38s cubic-bezier(0.16, 1, 0.3, 1); }

        /* 头像呼吸缩放 + 切换时的高亮环（不在角标放色点，色点在下方"正在工作中"里） */
        #npc-workbench .agent-badge-avatar-wrap {
            position: relative;
            animation: npcAvatarBreathe 2.2s ease-in-out infinite;
        }
        @keyframes npcAvatarBreathe {
            0%, 100% { transform: scale(1); }
            50%      { transform: scale(1.08); }
        }
        .npc-switch-anim .agent-badge-avatar-wrap {
            animation: npcAvatarBreathe 2.2s ease-in-out infinite, npcAvatarRing 0.6s ease-out;
        }
        @keyframes npcAvatarRing {
            0%   { box-shadow: 0 0 0 0 rgba(29,29,31,0.22); }
            100% { box-shadow: 0 0 0 16px rgba(29,29,31,0); }
        }

        /* "正在工作中"状态胶囊：仅工作台内为绿色圆点 + 绿色文字 */
        #npc-workbench .agent-badge-status {
            color: #1F9D55;
            background: rgba(52, 199, 89, 0.12);
            animation: npcStatusBlink 1.6s ease-in-out infinite;
        }
        @keyframes npcStatusBlink {
            0%, 100% { opacity: 1; }
            50%      { opacity: 0.55; }
        }

        /* 中止态：工牌状态改红、停呼吸动画 */
        #npc-workbench.is-aborted .agent-badge-status {
            color: #FF3B30;
            background: rgba(255, 59, 48, 0.12);
            animation: none;
        }
        #npc-workbench.is-aborted .agent-badge-avatar-wrap {
            animation: none !important;
        }
        #npc-workbench.is-aborted .npc-work-anim { opacity: 0.35; }
        #npc-workbench.is-aborted .npc-work-label { color: #FF3B30; }

        /* 六人条：工作终止态 */
        .agent-dot.aborted .agent-dot-avatar {
            background: #ffffff;
            border: 2.5px solid #FF3B30;
            animation: none;
            box-shadow: 0 0 0 3px rgba(255,59,48,0.12);
        }
        .agent-dot.aborted .agent-dot-avatar svg { opacity: 1; }
        .agent-dot.aborted .agent-dot-name { color: #1d1d1f; font-weight: 700; }
        .agent-dot.aborted .agent-dot-state { color: #FF3B30; font-weight: 700; }

        /* 当前任务卡：终止标签 */
        .agent-task-card-tag.is-aborted {
            color: #FF3B30;
            background: rgba(255, 59, 48, 0.12);
        }

        /* 返回首页按钮：左对齐，与右侧内容同列 */
        #form-section .back-home-btn {
            width: 100%; margin-top: 0;
            padding: 14px 20px; font-size: 0.95rem; font-weight: 600;
            color: #1D1D1F; border-color: rgba(0,0,0,0.14);
            background: #fff; border-radius: 12px;
            box-sizing: border-box;
        }
        #form-section .back-home-btn:hover {
            background: #f5f5f7; color: #1D1D1F; border-color: #1D1D1F;
        }

        /* 工牌下方：工作小动画（按阶段区分，克制、循环） */
        .npc-work-anim { height: 26px; display: flex; align-items: center; justify-content: center; }
        .npc-work-label { font-size: 0.8rem; color: #6e6e73; text-align: center; max-width: 260px; line-height: 1.4; }

        /* 1）笔书写：笔尖沿虚线来回滑动（用内联 SVG，避免字符字体不显示） */
        .npc-anim-write { display: flex; align-items: center; gap: 6px; }
        .npc-anim-write .npc-write-line {
            width: 64px; height: 1px; background-image: linear-gradient(90deg, rgba(29,29,31,0.35) 0 6px, transparent 6px 10px);
            background-size: 10px 1px; background-repeat: repeat-x; position: relative;
        }
        .npc-anim-write .npc-write-pen {
            display: inline-flex; align-items: center; justify-content: center;
            animation: npcPenMove 1.8s ease-in-out infinite;
        }
        .npc-anim-write .npc-write-pen svg { width: 16px; height: 16px; display: block; }
        @keyframes npcPenMove {
            0%   { transform: translateX(-26px) rotate(-8deg); }
            50%  { transform: translateX(26px)  rotate(-8deg); }
            100% { transform: translateX(-26px) rotate(-8deg); }
        }

        /* 2）生成中点阵：色块交错闪烁 */
        .npc-anim-pulse { display: flex; align-items: center; gap: 5px; }
        .npc-anim-pulse span {
            width: 7px; height: 7px; border-radius: 2px;
            background: rgba(29,29,31,0.7);
            animation: npcPulseBlink 1.2s ease-in-out infinite;
        }
        .npc-anim-pulse span:nth-child(2) { animation-delay: 0.15s; }
        .npc-anim-pulse span:nth-child(3) { animation-delay: 0.3s; }
        .npc-anim-pulse span:nth-child(4) { animation-delay: 0.45s; }
        @keyframes npcPulseBlink {
            0%, 100% { opacity: 0.25; transform: scale(0.85); }
            50%      { opacity: 1;    transform: scale(1); }
        }

        /* 3）完成勾选：交付阶段循环描边打勾 */
        .npc-anim-check svg { width: 22px; height: 22px; }
        .npc-anim-check .npc-check-path {
            stroke-dasharray: 20;
            stroke-dashoffset: 20;
            animation: npcCheckDraw 2s ease-in-out infinite;
        }
        @keyframes npcCheckDraw {
            0%   { stroke-dashoffset: 20; opacity: 0.4; }
            40%  { stroke-dashoffset: 0;  opacity: 1; }
            80%  { stroke-dashoffset: 0;  opacity: 1; }
            100% { stroke-dashoffset: 20; opacity: 0.4; }
        }

        /* --- 业务选择页（登录后工作台入口） --- */
        #workspace-select-section {
            display: none;
            width: 100%;
            max-width: 100%;
            min-height: 100dvh;
            padding: 20px 24px 32px;
            box-sizing: border-box;
            background: #f5f5f7;
            text-align: center;
        }
        #workspace-select-section:not(.hidden) { display: flex; flex-direction: column; align-items: center; }
        /* 自然文档流滚动：不锁 height/overflow。仅防横向溢出 */
        html:has(#workspace-select-section:not(.hidden)) {
            height: auto;
            max-height: none;
            overflow-x: clip;
        }
        body:has(#workspace-select-section:not(.hidden)) {
            background: #f5f5f7;
            background-image: none;
            background-attachment: scroll;
            padding: 0;
            margin: 0;
            display: block;
            justify-content: flex-start;
            align-items: stretch;
            min-height: 100dvh;
            height: auto;
            max-height: none;
            overflow-x: clip;
            overflow-y: visible;
        }
        body:has(#workspace-select-section:not(.hidden)) .container {
            display: contents;
            max-width: 100%;
            height: auto;
            max-height: none;
        }
        body:has(#workspace-select-section:not(.hidden)) .logo,
        body:has(#workspace-select-section:not(.hidden)) #login-layout,
        body:has(#workspace-select-section:not(.hidden)) #site-footer { display: none !important; }

        .ws-topbar {
            width: 100%; max-width: 920px;
            display: flex; align-items: center; justify-content: space-between;
            gap: 10px; margin-bottom: 16px;
            text-align: left;
            position: sticky;
            top: 0;
            z-index: 5;
            padding: 8px 0;
            background: #f5f5f7;
            box-sizing: border-box;
        }
        .ws-brand {
            font-size: 0.95rem; font-weight: 800; letter-spacing: 0.14em; color: #1d1d1f;
        }
        .ws-user-meta {
            display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
            font-size: 0.85rem; color: #6e6e73; font-weight: 500;
        }
        .ws-user-meta strong { color: #1d1d1f; font-weight: 700; }
        .ws-logout-btn {
            appearance: none; border: 1px solid rgba(0,0,0,0.14);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.82rem; font-weight: 600;
            padding: 7px 14px; border-radius: 999px; cursor: pointer;
            transition: background 0.2s ease, border-color 0.2s ease;
        }
        .ws-logout-btn:hover { background: #f5f5f7; border-color: rgba(0,0,0,0.28); }
        .ws-admin-btn {
            appearance: none; border: 1px solid rgba(0,0,0,0.14);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.82rem; font-weight: 600;
            padding: 7px 14px; border-radius: 999px; cursor: pointer;
            transition: background 0.2s ease, border-color 0.2s ease;
        }
        .ws-admin-btn:hover { background: #f5f5f7; border-color: rgba(0,0,0,0.28); }
        .form-admin-btn {
            appearance: none; border: 1px solid rgba(0,0,0,0.14);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.82rem; font-weight: 600;
            padding: 6px 12px; border-radius: 999px; cursor: pointer;
            flex-shrink: 0;
            transition: background 0.2s ease, border-color 0.2s ease;
        }
        .form-admin-btn:hover { background: #fff; border-color: rgba(0,0,0,0.28); }

        .ws-title {
            margin: 0 0 6px;
            font-size: clamp(1.35rem, 2.4vw, 1.7rem); font-weight: 800;
            color: #1d1d1f; letter-spacing: -0.02em;
        }
        .ws-subtitle {
            margin: 0 0 14px;
            font-size: 0.9rem; color: #86868b; line-height: 1.45;
        }
        .ws-admin-link {
            margin: -22px 0 28px;
            text-align: center;
        }
        .ws-admin-text-btn {
            appearance: none; -webkit-appearance: none;
            border: none; background: none; padding: 0;
            font-family: inherit; font-size: 0.92rem; font-weight: 600;
            color: #1d1d1f; cursor: pointer;
            text-decoration: underline; text-underline-offset: 3px;
        }
        .ws-admin-text-btn:hover { color: #000; }
        .ws-grid {
            width: 100%; max-width: 920px;
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
            text-align: left;
        }
        .ws-card {
            position: relative;
            background: #ffffff;
            border: 1px solid rgba(0,0,0,0.06);
            border-radius: 16px;
            padding: 16px 18px 14px;
            box-shadow: 0 6px 20px rgba(29,29,31,0.045);
            display: flex; flex-direction: column; gap: 8px;
            min-height: 0;
            box-sizing: border-box;
            transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
        }
        @media (hover: hover) {
            .ws-card.available:hover {
                transform: translateY(-2px);
                box-shadow: 0 12px 32px rgba(29,29,31,0.08);
                border-color: rgba(0,0,0,0.1);
            }
        }
        .ws-card.beta {
            background: #fcfcfd;
        }
        .ws-card.coming {
            background: #f8f8f9;
            opacity: 0.72;
            box-shadow: none;
        }
        .ws-card-badge {
            position: absolute; top: 12px; right: 12px;
            font-size: 0.7rem; font-weight: 700;
            padding: 3px 9px; border-radius: 999px;
            letter-spacing: 0.02em;
        }
        .ws-card.available .ws-card-badge {
            color: #1F9D55; background: rgba(52, 199, 89, 0.14);
        }
        .ws-card.beta .ws-card-badge {
            color: #B26A00; background: rgba(255, 179, 64, 0.18);
            border: 1px solid rgba(178, 106, 0, 0.22);
        }
        .ws-card.coming .ws-card-badge {
            color: #86868b; background: rgba(0,0,0,0.06);
        }
        .ws-card-title {
            margin: 0; padding-right: 68px;
            font-size: 1.05rem; font-weight: 800; color: #1d1d1f;
        }
        .ws-card.coming .ws-card-title { color: #6e6e73; }
        .ws-card-desc {
            margin: 0; flex: 1;
            font-size: 0.86rem; line-height: 1.5; color: #6e6e73;
        }
        .ws-card.coming .ws-card-desc { color: #aeaeb2; }
        .ws-card-btn {
            appearance: none; border: none;
            width: 100%; margin-top: 4px;
            padding: 10px 14px; border-radius: 11px;
            font-family: inherit; font-size: 0.88rem; font-weight: 700;
            cursor: pointer;
            transition: background 0.2s ease, transform 0.15s ease, opacity 0.2s ease;
        }
        .ws-card.available .ws-card-btn {
            background: #1d1d1f; color: #fff;
        }
        .ws-card.available .ws-card-btn:hover { background: #000; transform: scale(1.01); }
        .ws-card.beta .ws-card-btn {
            background: #fff; color: #1d1d1f;
            border: 1.5px solid rgba(178, 106, 0, 0.45);
        }
        .ws-card.beta .ws-card-btn:hover { background: rgba(255, 179, 64, 0.12); }
        .ws-card.coming .ws-card-btn {
            background: rgba(0,0,0,0.06); color: #86868b;
            cursor: pointer;
        }
        .ws-card.coming .ws-card-btn:hover { background: rgba(0,0,0,0.09); }
        .ws-beta-tip {
            display: none;
            width: 100%; max-width: 920px;
            margin-top: 12px;
            padding: 10px 14px;
            background: rgba(255, 179, 64, 0.12);
            border: 1px solid rgba(178, 106, 0, 0.18);
            border-radius: 12px;
            color: #8A5A00;
            font-size: 0.86rem; font-weight: 600;
            text-align: left;
        }
        .ws-beta-tip.show { display: block; }
        .ws-section-title {
            margin: 22px 0 4px;
            font-size: 1.1rem;
            font-weight: 800;
            color: #1d1d1f;
            letter-spacing: -0.02em;
            width: 100%;
            max-width: 920px;
            text-align: left;
        }
        .ws-section-title.ws-section-first {
            margin-top: 2px;
        }
        .ws-section-sub {
            margin: 0 0 10px;
            font-size: 0.84rem;
            color: #86868b;
            line-height: 1.4;
            width: 100%;
            max-width: 920px;
            text-align: left;
        }
        .ws-design-grid {
            margin-bottom: 0;
            /* 与策划区共用 .ws-grid：桌面两列并排，窄屏由 .ws-grid 媒体查询改单列 */
        }

        /* --- 设计类型选择页 --- */
        #design-type-section {
            display: none;
            width: 100%;
            min-height: 100dvh;
            padding: 48px 24px 56px;
            box-sizing: border-box;
            background: #f5f5f7;
            text-align: center;
        }
        #design-type-section:not(.hidden) {
            display: flex; flex-direction: column; align-items: center;
        }
        body:has(#design-type-section:not(.hidden)) {
            background: #f5f5f7; padding: 0; overflow-y: auto;
            min-height: 100dvh;
        }
        body:has(#design-type-section:not(.hidden)) .container { display: contents; }
        body:has(#design-type-section:not(.hidden)) .logo,
        body:has(#design-type-section:not(.hidden)) #login-layout,
        body:has(#design-type-section:not(.hidden)) #workspace-select-section,
        body:has(#design-type-section:not(.hidden)) #team-intro-section,
        body:has(#design-type-section:not(.hidden)) #form-section,
        body:has(#design-type-section:not(.hidden)) #design-section,
        body:has(#design-type-section:not(.hidden)) #ad-display-section,
        body:has(#design-type-section:not(.hidden)) #site-footer { display: none !important; }
        .design-type-topbar {
            width: 100%; max-width: 980px;
            display: flex; align-items: center; justify-content: space-between;
            gap: 12px; margin-bottom: 36px;
            text-align: left;
        }
        .design-type-brand {
            font-size: 0.95rem; font-weight: 800; letter-spacing: 0.14em; color: #1d1d1f;
        }
        .design-type-back-btn {
            appearance: none; border: 1px solid rgba(0,0,0,0.14);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.85rem; font-weight: 600;
            padding: 8px 14px; border-radius: 999px; cursor: pointer;
        }
        .design-type-back-btn:hover { background: #f5f5f7; }
        .design-type-title {
            margin: 0 0 10px;
            font-size: clamp(1.6rem, 3vw, 2rem); font-weight: 800;
            color: #1d1d1f; letter-spacing: -0.02em;
        }
        .design-type-sub {
            margin: 0 0 36px;
            font-size: 0.98rem; color: #86868b; line-height: 1.6;
        }
        .design-type-grid {
            width: 100%; max-width: 980px;
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 18px;
            text-align: left;
        }
        .design-type-grid .ws-card-btn:disabled {
            cursor: not-allowed;
            pointer-events: none;
        }
        @media (max-width: 900px) {
            .design-type-grid {
                grid-template-columns: 1fr;
                max-width: 420px;
            }
        }


        /* --- 平面设计 / 广告布置页（同一通栏壳；body.design-workspace-open 由 JS 同步） --- */
        .design-app-shell,
        #design-section,
        #ad-display-section {
            display: none;
            width: 100%;
            max-width: none;
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            text-align: left;
            height: 100dvh;
            overflow: hidden;
            background: #ffffff;
        }
        .design-app-shell:not(.hidden),
        #design-section:not(.hidden),
        #ad-display-section:not(.hidden) {
            display: flex;
            flex-direction: column;
        }
        /* 广告布置：fixed 贴边，不依赖 body padding / 居中容器，避免四周灰底留白 */
        #ad-display-section:not(.hidden) {
            position: fixed !important;
            inset: 0 !important;
            z-index: 1200 !important;
            width: 100vw !important;
            max-width: none !important;
            height: 100dvh !important;
            margin: 0 !important;
            padding: 0 !important;
            display: flex !important;
            flex-direction: column !important;
            overflow: hidden !important;
            background: #ffffff !important;
            box-sizing: border-box !important;
        }
        #ad-display-section:not(.hidden) .design-layout {
            flex: 1 1 auto !important;
            min-height: 0 !important;
            width: 100% !important;
            height: calc(100dvh - 58px) !important;
            overflow: hidden !important;
        }
        #ad-display-section:not(.hidden) .design-form-scroll {
            flex: 1 1 auto !important;
            min-height: 0 !important;
            overflow-y: auto !important;
        }
        #ad-display-section:not(.hidden) .design-form-footer {
            flex-shrink: 0 !important;
            width: 100% !important;
            box-sizing: border-box !important;
        }
        #ad-display-section:not(.hidden) #ad-gen-btn.design-gen-btn,
        #ad-display-section:not(.hidden) #ad-gen-btn {
            display: block !important;
            width: auto !important;
            flex: 1.7 !important;
            max-width: none !important;
            min-height: 48px !important;
            margin: 0 !important;
            border: none !important;
            border-radius: 12px !important;
            background: #1d1d1f !important;
            color: #fff !important;
            font-family: inherit !important;
            font-size: 0.98rem !important;
            font-weight: 800 !important;
            padding: 14px 16px !important;
            box-sizing: border-box !important;
            cursor: pointer !important;
        }
        #ad-display-section:not(.hidden) #ad-gen-btn:hover,
        #ad-display-section:not(.hidden) #ad-gen-btn.design-gen-btn:hover {
            background: #000 !important;
        }
        #ad-display-section:not(.hidden) #ad-gen-btn:disabled,
        #ad-display-section:not(.hidden) #ad-gen-btn.design-gen-btn:disabled {
            background: #d2d2d7 !important;
            color: #fff !important;
            cursor: not-allowed !important;
        }
        #ad-display-section:not(.hidden) #ad-gen-btn:disabled:hover,
        #ad-display-section:not(.hidden) #ad-gen-btn.design-gen-btn:disabled:hover {
            background: #d2d2d7 !important;
        }
        html.design-workspace-open {
            height: 100%;
            overflow: hidden;
        }
        body.design-workspace-open {
            display: block !important;
            justify-content: flex-start !important;
            align-items: stretch !important;
            margin: 0 !important;
            padding: 0 !important;
            min-height: 100dvh;
            height: 100dvh;
            overflow: hidden !important;
            overflow-x: hidden !important;
            background-color: #ffffff !important;
            background-image: none !important;
            background-attachment: scroll !important;
        }
        body.design-workspace-open .container {
            display: contents;
            width: 100%;
            max-width: none;
            margin: 0;
            padding: 0;
            align-items: stretch;
        }
        body.design-workspace-open .logo,
        body.design-workspace-open #login-layout,
        body.design-workspace-open #workspace-select-section,
        body.design-workspace-open #design-type-section,
        body.design-workspace-open #team-intro-section,
        body.design-workspace-open #form-section,
        body.design-workspace-open #verify-section,
        body.design-workspace-open #agent-select-section,
        body.design-workspace-open #chat-section,
        body.design-workspace-open #site-footer,
        body:has(#ad-display-section:not(.hidden)) .logo,
        body:has(#ad-display-section:not(.hidden)) #site-footer,
        body:has(#ad-display-section:not(.hidden)) #login-layout,
        body:has(#ad-display-section:not(.hidden)) #workspace-select-section {
            display: none !important;
        }
        body.design-workspace-open #design-section.hidden,
        body.design-workspace-open #ad-display-section.hidden {
            display: none !important;
        }

        .design-topbar {
            display: flex; align-items: center; justify-content: space-between;
            gap: 12px;
            flex-shrink: 0;
            min-height: 58px;
            height: auto;
            padding: 8px 20px;
            box-sizing: border-box;
            border-bottom: 1px solid rgba(0,0,0,0.06);
            background: #ffffff;
            z-index: 5;
        }
        .design-topbar-main {
            display: flex; flex-direction: column; gap: 2px; min-width: 0;
        }
        .design-topbar-row {
            display: flex; align-items: baseline; gap: 10px; min-width: 0;
        }
        .design-brand {
            font-size: 0.72rem; font-weight: 800; letter-spacing: 0.14em; color: #86868b;
        }
        .design-title {
            margin: 0;
            font-size: 1.05rem;
            font-weight: 800; color: #1d1d1f; letter-spacing: -0.02em;
        }
        .design-topbar-desc {
            margin: 0;
            font-size: 0.78rem; color: #86868b; line-height: 1.4;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            max-width: min(720px, 58vw);
        }
        .design-back-btn {
            appearance: none; border: 1px solid rgba(0,0,0,0.12);
            background: #fff; color: #1d1d1f;
            font-family: inherit; font-size: 0.84rem; font-weight: 600;
            padding: 7px 14px; border-radius: 999px; cursor: pointer;
            flex-shrink: 0;
        }
        .design-back-btn:hover { background: #f5f5f7; }

        .design-layout {
            flex: 1;
            min-height: 0;
            width: 100%;
            display: grid;
            grid-template-columns: minmax(320px, 1.05fr) minmax(360px, 1.15fr);
            gap: 0;
            overflow: hidden;
            height: calc(100dvh - 58px);
        }

        .design-left {
            display: flex;
            flex-direction: column;
            min-height: 0;
            min-width: 0;
            height: 100%;
            overflow: hidden;
            background: linear-gradient(165deg, #f8f9fb 0%, #eef1f5 100%);
            border-right: 1px solid rgba(0,0,0,0.06);
        }
        .design-chat,
        .design-preview {
            flex: 1 1 0;
            min-height: 0;
            display: flex;
            flex-direction: column;
            overflow: hidden;
        }
        .design-preview {
            border-top: 1px solid rgba(0,0,0,0.06);
            background: rgba(255,255,255,0.35);
        }

        .design-chat-head {
            padding: 18px 28px 10px;
            flex-shrink: 0;
        }
        .design-chat-head-row {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 10px;
        }
        .design-chat-head .aria-badge-mini {
            padding-bottom: 12px;
            margin-bottom: 0;
            flex: 1;
            min-width: 0;
        }
        .design-assist-exit-btn {
            display: none;
            appearance: none;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            border: 1.5px solid #C5A46E;
            background: #F3E6D0;
            color: #5C4A32;
            font-family: inherit;
            font-size: 0.86rem;
            font-weight: 700;
            padding: 10px 14px;
            border-radius: 12px;
            cursor: pointer;
            line-height: 1.2;
            white-space: nowrap;
            box-shadow: none;
        }
        .design-assist-exit-btn:hover {
            background: #EBD9BC;
            border-color: #C5A46E;
            color: #5C4A32;
        }
        .design-assist-actions {
            display: none;
            flex-shrink: 0;
            flex-wrap: nowrap;
            align-items: stretch;
            gap: 8px;
            padding: 8px 28px 4px;
            background: rgba(255,255,255,0.72);
            border-top: 1px solid rgba(0,0,0,0.06);
        }
        .design-assist-btn {
            appearance: none;
            flex: 1 1 0;
            min-width: 0;
            min-height: 34px;
            border: 1.5px solid rgba(0,0,0,0.16);
            border-radius: 12px;
            background: #f5f5f7;
            color: #1d1d1f;
            font-family: inherit;
            font-size: 0.8rem;
            font-weight: 600;
            cursor: pointer;
            padding: 7px 10px;
            letter-spacing: 0.01em;
            white-space: nowrap;
            line-height: 1.2;
        }
        .design-assist-btn:hover { background: #ececee; }
        .design-assist-btn:disabled { opacity: 0.55; cursor: default; }
        .design-assist-btn-read {
            background: #fff;
            border-color: rgba(0,0,0,0.18);
            color: #1d1d1f;
            font-weight: 600;
        }
        .design-assist-btn-read:hover { background: #f5f5f7; }
        .design-assist-btn-vision {
            flex: 1 1 0;
        }
        .design-assist-btn-apply,
        #design-assist-apply,
        #ad-assist-apply {
            flex: 1.22 1 0;
            background: #1d1d1f;
            color: #fff;
            border-color: #1d1d1f;
            font-weight: 700;
        }
        .design-assist-btn-apply:hover,
        #design-assist-apply:hover,
        #ad-assist-apply:hover { background: #000; border-color: #000; }
        .design-assist-btn-apply:disabled:hover,
        #design-assist-apply:disabled:hover,
        #ad-assist-apply:disabled:hover { background: #1d1d1f; border-color: #1d1d1f; }
        #design-section.design-assist-mode .design-preview,
        #ad-display-section.design-assist-mode .design-preview {
            display: none !important;
        }
        #design-section.design-assist-mode.has-gen-preview .design-preview,
        #ad-display-section.design-assist-mode.has-gen-preview .design-preview,
        #design-section.design-assist-mode:has(.design-result-ok.show) .design-preview,
        #ad-display-section.design-assist-mode:has(.design-result-ok.show) .design-preview {
            display: flex !important;
            flex: 1 1 0;
            min-height: 200px;
        }
        #design-section.design-assist-mode .design-chat,
        #ad-display-section.design-assist-mode .design-chat {
            flex: 1 1 auto;
            min-height: 0;
        }
        #design-section.design-assist-mode.has-gen-preview .design-chat,
        #ad-display-section.design-assist-mode.has-gen-preview .design-chat,
        #design-section.design-assist-mode:has(.design-result-ok.show) .design-chat,
        #ad-display-section.design-assist-mode:has(.design-result-ok.show) .design-chat {
            flex: 1 1 0;
            min-height: 160px;
        }
        #design-section.design-assist-mode .design-assist-exit-btn,
        #design-section.design-assist-mode .design-assist-actions,
        #ad-display-section.design-assist-mode .design-assist-exit-btn,
        #ad-display-section.design-assist-mode .design-assist-actions {
            display: flex;
        }
        #design-section.design-assist-mode .design-chat-messages,
        #ad-display-section.design-assist-mode .design-chat-messages {
            gap: 14px;
            padding-top: 8px;
            padding-bottom: 10px;
        }
        #design-section.design-assist-mode .design-msg,
        #ad-display-section.design-assist-mode .design-msg {
            max-width: 100%;
            font-size: 0.9375rem;
            line-height: 1.68;
        }
        .design-chat-sub,
        .design-chat-head .aria-badge-mini-desc {
            margin: 0;
            padding: 10px 0 0;
            font-size: 0.84rem; color: #48484a; line-height: 1.6;
            border-top: none;
        }
        .design-chat-messages {
            flex: 1;
            min-height: 0;
            overflow-y: auto;
            display: flex; flex-direction: column; gap: 10px;
            padding: 4px 28px 8px;
            -webkit-overflow-scrolling: touch;
        }
        .design-msg {
            max-width: 100%;
            box-sizing: border-box;
            padding: 12px 16px;
            font-size: 0.9375rem;
            line-height: 1.68;
            word-wrap: break-word;
            overflow-wrap: anywhere;
            border-radius: 16px 16px 16px 4px;
        }
        .design-msg-ai {
            align-self: flex-start;
            background: #F5F5F7;
            color: #1d1d1f;
            white-space: normal;
            max-height: none;
            overflow: visible;
        }
        .design-msg-ai p {
            margin: 0 0 0.72em;
        }
        .design-msg-ai p:last-child { margin-bottom: 0; }
        .design-msg-ai ul,
        .design-msg-ai ol {
            margin: 0.15em 0 0.75em;
            padding-left: 1.35em;
        }
        .design-msg-ai li {
            margin: 0.22em 0;
            line-height: 1.68;
        }
        .design-msg-ai strong { font-weight: 700; }
        .design-msg details,
        .design-msg-ai details {
            display: block;
        }
        .design-msg details > summary,
        .design-msg-ai details > summary {
            display: block;
            cursor: default;
            pointer-events: none;
            list-style: none;
            font-weight: 700;
        }
        .design-msg details > summary::-webkit-details-marker,
        .design-msg details > summary::marker,
        .design-msg-ai details > summary::-webkit-details-marker,
        .design-msg-ai details > summary::marker {
            display: none;
            content: none;
        }
        .design-msg-user {
            align-self: flex-end;
            background: var(--accent-green);
            color: #fff;
            border-radius: 16px 16px 4px 16px;
            white-space: pre-wrap;
            max-height: none;
            overflow: visible;
        }
        .design-msg-typing { color: #86868b; max-height: none; overflow: visible; }
        .design-msg-wrap {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            max-width: 94%;
        }
        .design-msg-wrap-user {
            align-self: flex-end;
            align-items: flex-end;
        }
        .design-chat-inputbar {
            display: flex;
            flex-direction: column;
            gap: 0;
            padding: 4px 28px 16px;
            flex-shrink: 0;
            background: rgba(255,255,255,0.88);
        }
        .design-chat-resize-handle {
            flex-shrink: 0;
            height: 14px;
            margin: 0 0 4px;
            cursor: ns-resize;
            touch-action: none;
            user-select: none;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .design-chat-resize-handle::before {
            content: '';
            width: 40px;
            height: 3px;
            border-radius: 999px;
            background: rgba(0,0,0,0.18);
        }
        .design-chat-resize-handle:hover::before,
        .design-chat-resize-handle.is-dragging::before {
            background: rgba(0,0,0,0.32);
        }
        .design-chat-inputrow {
            display: flex;
            gap: 8px;
            align-items: flex-end;
            min-height: 0;
        }
        .design-chat-inputbar textarea {
            flex: 1;
            min-width: 0;
            min-height: 44px;
            max-height: min(40vh, 280px);
            height: 44px;
            border: 1px solid rgba(0,0,0,0.1);
            background: #ffffff;
            border-radius: 18px;
            padding: 11px 14px;
            font-family: inherit;
            font-size: 0.88rem;
            line-height: 1.45;
            outline: none;
            resize: none;
            overflow-y: auto;
            box-sizing: border-box;
        }
        .design-chat-inputbar textarea:focus {
            border-color: var(--accent-green);
        }
        .design-chat-send {
            appearance: none; border: none;
            width: 38px; height: 38px; border-radius: 50%;
            background: var(--accent-green); color: #fff;
            font-size: 1rem; cursor: pointer; flex-shrink: 0;
            display: flex; align-items: center; justify-content: center;
        }
        .design-chat-send:hover:not(:disabled) { background: var(--accent-green-hover); }
        .design-chat-send:disabled { opacity: 0.6; cursor: default; }
        .design-chat-keyhint {
            margin: 6px 4px 0;
            font-size: 0.72rem;
            font-weight: 500;
            color: #86868b;
            line-height: 1.4;
            letter-spacing: 0.01em;
        }

        .design-preview-head {
            padding: 14px 28px 8px;
            flex-shrink: 0;
        }
        .design-preview-head h3 {
            margin: 0;
            font-size: 0.95rem; font-weight: 800; color: #1d1d1f;
        }
        .design-result-scroll {
            flex: 1;
            min-height: 0;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            padding: 0 28px 16px;
            -webkit-overflow-scrolling: touch;
        }

        .design-right {
            display: flex;
            flex-direction: column;
            min-height: 0;
            min-width: 0;
            height: 100%;
            overflow: hidden;
            background: #ffffff;
            box-shadow: -1px 0 0 rgba(0,0,0,0.07);
        }
        .design-right-head {
            flex-shrink: 0;
            padding: 28px 40px 0;
            box-sizing: border-box;
        }
        #design-section .design-right-head {
            padding: 24px 28px 0;
        }
        .design-right-head h2 {
            margin: 0 0 6px;
            font-size: 1.65rem; font-weight: 700; color: #000;
            letter-spacing: -0.4px;
        }
        .design-right-sub {
            margin: 0 0 16px;
            font-size: 0.92rem; color: #AEAEB2; line-height: 1.5;
        }
        .design-field-hint {
            margin: 6px 0 0;
            font-size: 0.72rem;
            color: #AEAEB2;
            line-height: 1.4;
            font-weight: 400;
        }
        .design-info-bar {
            display: flex; flex-wrap: wrap; gap: 10px 18px; align-items: center;
            background: #F5F5F7;
            border-radius: 12px;
            padding: 12px 16px;
            margin-bottom: 14px;
            font-size: 0.88rem; color: #48484a;
        }
        .design-info-bar strong { color: #1d1d1f; font-weight: 700; }
        .design-form-tip {
            display: none;
            margin: 0 0 12px;
            padding: 10px 12px;
            border-radius: 10px;
            background: rgba(52,199,89,0.1);
            border: 1px solid rgba(52,199,89,0.18);
            color: #1a7a3a;
            font-size: 0.84rem; font-weight: 600;
            line-height: 1.45;
        }
        .design-form-tip.show { display: block; }
        .design-form-scroll {
            flex: 1; min-height: 0;
            overflow-y: auto;
            padding: 8px 40px 16px;
            box-sizing: border-box;
            -webkit-overflow-scrolling: touch;
        }
        .design-form-footer {
            flex-shrink: 0;
            padding: 14px 40px 24px;
            border-top: 1px solid rgba(0,0,0,0.06);
            background: #ffffff;
            box-sizing: border-box;
        }
        .design-form-footer-actions {
            display: flex;
            gap: 10px;
            align-items: stretch;
        }
        .design-assist-open-btn {
            flex: 0.9;
            appearance: none;
            min-height: 48px;
            box-sizing: border-box;
            border: 1.5px solid #C5A46E;
            border-radius: 12px;
            background: #F3E6D0;
            color: #5C4A32;
            font-family: inherit;
            font-size: 0.9rem;
            font-weight: 700;
            cursor: pointer;
            padding: 12px 14px;
            letter-spacing: 0.01em;
        }
        .design-assist-open-btn:hover {
            background: #EBD9BC;
            border-color: #C5A46E;
            color: #5C4A32;
        }
        #design-section.design-assist-mode .design-assist-open-btn {
            background: #EBD9BC;
            border-color: #C5A46E;
            box-shadow: none;
            color: #5C4A32;
            font-weight: 700;
        }
        #design-section:not(.hidden) .design-form-footer-actions #design-gen-btn {
            width: auto;
            flex: 1.55;
        }
        .design-group { margin-bottom: 14px; }
        .design-group label,
        .design-ref-mode-label {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 0 2px;
            margin: 0 0 6px;
            font-size: 0.86rem; font-weight: 600; color: #1D1D1F;
            letter-spacing: 0.01em;
        }
        .field-tag-required,
        .field-tag-optional {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            box-sizing: border-box;
            margin-left: 6px;
            padding: 1px 6px;
            min-height: 16px;
            border-radius: 999px;
            font-size: 10px;
            font-weight: 600;
            letter-spacing: 0.04em;
            line-height: 1.2;
            white-space: nowrap;
            vertical-align: middle;
        }
        .field-tag-required {
            background: #1d1d1f;
            color: #fff;
            border: 1px solid #1d1d1f;
        }
        .field-tag-optional {
            background: #f2f2f7;
            color: #8e8e93;
            border: 1px solid #e5e5ea;
            font-weight: 500;
        }
        .design-req-legend {
            margin: 0 0 8px;
            font-size: 0.78rem;
            color: #6e6e73;
            line-height: 1.45;
        }
        .design-group .req::after,
        .design-group .opt::after,
        .design-ref-mode-label.req::after {
            content: none;
            display: none;
        }
        .design-form-section {
            margin: 0 0 16px;
            padding: 0 0 6px;
            border-bottom: 1px solid rgba(0,0,0,0.06);
        }
        .design-form-section:last-child {
            border-bottom: none;
            margin-bottom: 4px;
        }
        .design-form-section-title {
            margin: 0 0 10px;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            color: #AEAEB2;
            text-transform: none;
        }
        .design-form-section-opt .design-form-section-title {
            color: #C7C7CC;
            font-weight: 600;
        }
        .design-form-section-ref {
            background: #f7f8fa;
            border: 1px solid rgba(0,0,0,0.06);
            border-radius: 14px;
            padding: 12px 12px 8px;
            border-bottom: none;
        }
        #design-section .design-right-sub {
            font-size: 0.8rem;
            color: #8E8E93;
            margin: 0 0 12px;
        }
        #design-section .design-form-scroll {
            padding: 10px 28px 20px;
            container-type: inline-size;
            container-name: design-form;
        }
        #design-section .design-form-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            column-gap: 14px;
            align-items: start;
        }
        #design-section .design-form-span-2 {
            grid-column: 1 / -1;
        }
        #design-section #design-person-fields:not(.hidden) {
            display: contents;
        }
        @container design-form (max-width: 460px) {
            #design-section .design-form-grid {
                grid-template-columns: 1fr;
            }
        }
        #design-section .design-form-card {
            background: #fff;
            border: 1px solid rgba(0,0,0,0.08);
            border-radius: 16px;
            padding: 16px 16px 10px;
            margin: 0 0 12px;
            box-shadow: 0 1px 2px rgba(0,0,0,0.03);
            border-bottom: none;
        }
        #design-section .design-form-card > .design-form-section-title {
            margin: 0 0 12px;
            font-size: 0.98rem;
            font-weight: 800;
            letter-spacing: 0.01em;
            color: #111;
        }
        #design-section .design-card-lead {
            margin: -4px 0 12px;
            font-size: 0.72rem;
            color: #AEAEB2;
            line-height: 1.45;
            font-weight: 400;
        }
        #design-section .design-form-card-ref {
            background: #f2f3f6;
            border: 1.5px dashed rgba(0,0,0,0.16);
            box-shadow: none;
        }
        #design-section .design-form-card-ref .design-ref-dropzone {
            background: #fff;
            border-style: dashed;
            min-height: 88px;
        }
        #design-section .design-form-card-ref .design-ref-thumb {
            position: relative;
            width: 88px;
            height: 88px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.08);
        }
        #design-section .design-form-card-ref .design-ref-thumb::after {
            content: '点击放大';
            position: absolute;
            left: 0; right: 0; bottom: 0;
            background: rgba(0,0,0,0.55);
            color: #fff;
            font-size: 0.62rem;
            font-weight: 600;
            text-align: center;
            padding: 4px 0;
            letter-spacing: 0.02em;
            pointer-events: none;
        }
        #design-section .design-form-card-more .design-form-section {
            margin: 0 0 12px;
            padding: 0 0 10px;
            border-bottom: 1px solid rgba(0,0,0,0.06);
            background: transparent;
        }
        #design-section .design-form-card-more .design-form-section:last-child {
            border-bottom: none;
            margin-bottom: 0;
            padding-bottom: 0;
        }
        #design-section .design-form-card-more .design-form-section-title,
        #design-section .design-form-card-more .design-copy-toggle {
            margin: 0 0 8px;
            font-size: 0.84rem;
            font-weight: 700;
            letter-spacing: 0.02em;
            color: #1d1d1f;
        }
        #design-section .design-form-card-more .design-copy-toggle {
            width: 100%;
            padding: 0 0 8px;
            text-align: left;
        }
        #design-section .design-group {
            margin-bottom: 12px;
        }
        #design-section .design-group label {
            font-size: 0.78rem;
            margin: 0 0 5px;
            font-weight: 600;
        }
        #design-section .design-group .req::after,
        #design-section .design-ref-mode-label.req::after,
        #design-section .design-group .opt::after {
            content: none;
            display: none;
        }
        #design-section .design-field-hint {
            font-size: 0.68rem;
            color: #AEAEB2;
            margin: 6px 0 0;
            line-height: 1.4;
        }
        #design-section .design-ratio {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 8px;
            width: 100%;
        }
        #design-section .design-ratio-btn {
            width: 100%;
            min-height: 44px;
            box-sizing: border-box;
            margin: 0;
            padding: 8px 6px;
            border: 1.5px solid rgba(0,0,0,0.18);
            border-radius: 10px;
            background: #fff;
            color: #6e6e73;
            font-size: 0.8rem;
            font-weight: 600;
            line-height: 1.25;
            text-align: center;
        }
        #design-section .design-ratio-btn.active {
            background: #1d1d1f;
            color: #fff;
            border-color: #1d1d1f;
        }
        #design-section .design-form-footer {
            background: #f4f4f6;
            padding: 16px 28px 20px;
            border-top: 1px solid rgba(0,0,0,0.06);
            box-shadow: 0 -6px 18px rgba(0,0,0,0.04);
        }
        #design-section .design-form-footer .design-hint {
            font-size: 0.78rem;
            color: #8E8E93;
            margin: 0 0 12px;
        }
        #design-section .design-assist-open-btn {
            flex: 0.9;
            background: #F3E6D0;
            border: 1.5px solid #C5A46E;
            color: #5C4A32;
            font-weight: 700;
            font-size: 0.9rem;
            min-height: 48px;
            box-shadow: none;
        }
        #design-section .design-assist-open-btn:hover {
            background: #EBD9BC;
            border-color: #C5A46E;
            color: #5C4A32;
        }
        #design-section.design-assist-mode .design-assist-open-btn {
            background: #EBD9BC;
            border-color: #C5A46E;
            color: #5C4A32;
        }
        #design-section:not(.hidden) .design-form-footer-actions #design-gen-btn {
            flex: 1.7;
            min-height: 48px;
            font-weight: 800;
            background: #1d1d1f;
            color: #fff;
            border: none;
        }
        #design-section:not(.hidden) .design-form-footer-actions #design-gen-btn:hover {
            background: #000;
        }
        #design-section:not(.hidden) .design-form-footer-actions #design-gen-btn:disabled,
        #design-section:not(.hidden) .design-form-footer-actions #design-gen-btn:disabled:hover {
            background: #d2d2d7;
            color: #fff;
        }
        #design-section .design-group.is-invalid input,
        #design-section .design-group.is-invalid select,
        #design-section .design-group.is-invalid textarea,
        #design-section .design-ratio.is-invalid .design-ratio-btn,
        #design-section .design-ref-mode-wrap.is-invalid {
            border-color: #FF3B30;
            box-shadow: 0 0 0 3px rgba(255,59,48,0.14);
        }
        #design-section .design-ref-mode-wrap.is-invalid {
            border-radius: 12px;
            padding: 8px;
        }
        #ad-display-section .design-right-head {
            padding: 24px 28px 0;
        }
        #ad-display-section .design-right-sub {
            font-size: 0.8rem;
            color: #8E8E93;
            margin: 0 0 12px;
        }
        #ad-display-section .design-form-scroll {
            padding: 10px 28px 20px;
            container-type: inline-size;
            container-name: ad-form;
        }
        #ad-display-section .ad-form-grid {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            column-gap: 14px;
            align-items: start;
        }
        #ad-display-section .ad-form-span-2 {
            grid-column: 1 / -1;
        }
        #ad-display-section #ad-person-fields:not(.hidden) {
            display: contents;
        }
        @container ad-form (max-width: 460px) {
            #ad-display-section .ad-form-grid {
                grid-template-columns: 1fr;
            }
        }
        #ad-display-section .design-form-card {
            background: #fff;
            border: 1px solid rgba(0,0,0,0.08);
            border-radius: 16px;
            padding: 16px 16px 10px;
            margin: 0 0 12px;
            box-shadow: 0 1px 2px rgba(0,0,0,0.03);
            border-bottom: none;
        }
        #ad-display-section .design-form-card > .design-form-section-title {
            margin: 0 0 12px;
            font-size: 0.98rem;
            font-weight: 800;
            letter-spacing: 0.01em;
            color: #111;
        }
        #ad-display-section .design-card-lead {
            margin: -4px 0 12px;
            font-size: 0.72rem;
            color: #AEAEB2;
            line-height: 1.45;
        }
        #ad-display-section .design-form-card-ref {
            background: #f2f3f6;
            border: 1.5px dashed rgba(0,0,0,0.16);
            box-shadow: none;
        }
        #ad-display-section .design-form-card-ref .design-ref-dropzone {
            background: #fff;
            border-style: dashed;
            min-height: 88px;
        }
        #ad-display-section .design-form-card-ref .design-ref-thumb {
            position: relative;
            width: 88px;
            height: 88px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.08);
            cursor: zoom-in;
        }
        #ad-display-section .design-form-card-ref .design-ref-thumb::after {
            content: '点击放大';
            position: absolute;
            left: 0; right: 0; bottom: 0;
            background: rgba(0,0,0,0.55);
            color: #fff;
            font-size: 0.62rem;
            font-weight: 600;
            text-align: center;
            padding: 4px 0;
            pointer-events: none;
        }
        #ad-display-section .design-form-card-more .design-form-section {
            margin: 0 0 12px;
            padding: 0 0 10px;
            border-bottom: 1px solid rgba(0,0,0,0.06);
            background: transparent;
        }
        #ad-display-section .design-form-card-more .design-form-section:last-child {
            border-bottom: none;
            margin-bottom: 0;
            padding-bottom: 0;
        }
        #ad-display-section .design-form-card-more .design-form-section-title {
            margin: 0 0 8px;
            font-size: 0.84rem;
            font-weight: 700;
            letter-spacing: 0.02em;
            color: #1d1d1f;
        }
        #ad-display-section .design-group { margin-bottom: 12px; }
        #ad-display-section .design-group label {
            font-size: 0.78rem;
            margin: 0 0 5px;
            font-weight: 600;
        }
        #ad-display-section .design-group .req::after,
        #ad-display-section .design-ref-mode-label.req::after,
        #ad-display-section .design-group .opt::after {
            content: none;
            display: none;
        }
        #ad-display-section .design-field-hint {
            font-size: 0.68rem;
            color: #AEAEB2;
            margin: 6px 0 0;
        }
        #ad-display-section .design-ratio {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 8px;
            width: 100%;
        }
        #ad-display-section .design-ratio-btn {
            width: 100%;
            min-height: 44px;
            box-sizing: border-box;
            border: 1.5px solid rgba(0,0,0,0.18);
            border-radius: 10px;
            background: #fff;
            color: #6e6e73;
            font-size: 0.8rem;
            font-weight: 600;
            text-align: center;
        }
        #ad-display-section .design-ratio-btn.active {
            background: #1d1d1f;
            color: #fff;
            border-color: #1d1d1f;
        }
        #ad-display-section .design-form-footer {
            background: #f4f4f6;
            padding: 16px 28px 20px;
            border-top: 1px solid rgba(0,0,0,0.06);
            box-shadow: 0 -6px 18px rgba(0,0,0,0.04);
        }
        #ad-display-section .design-form-footer .design-hint {
            font-size: 0.78rem;
            color: #8E8E93;
            margin: 0 0 12px;
        }
        #ad-display-section .design-form-footer-actions {
            display: flex;
            gap: 10px;
            align-items: stretch;
        }
        #ad-display-section .design-assist-open-btn {
            flex: 0.9;
            background: #F3E6D0;
            border: 1.5px solid #C5A46E;
            color: #5C4A32;
            font-weight: 700;
            font-size: 0.9rem;
            min-height: 48px;
            box-shadow: none;
        }
        #ad-display-section .design-assist-open-btn:hover {
            background: #EBD9BC;
            border-color: #C5A46E;
            color: #5C4A32;
        }
        #ad-display-section.design-assist-mode .design-assist-open-btn {
            background: #EBD9BC;
            border-color: #C5A46E;
            color: #5C4A32;
        }
        #ad_color_main_custom { margin-top: 8px; }
        .design-copy-toggle {
            appearance: none;
            width: 100%;
            border: none;
            background: transparent;
            color: #8E8E93;
            font-family: inherit;
            font-size: 0.72rem;
            font-weight: 700;
            letter-spacing: 0.06em;
            padding: 2px 0 8px;
            cursor: pointer;
            text-align: left;
        }
        .design-copy-toggle:hover,
        .design-copy-toggle.is-open { color: #6e6e73; }
        .design-copy-panel { display: none; }
        .design-copy-panel.open { display: block; }
        .design-group input[type="text"],
        .design-group select,
        .design-group textarea {
            width: 100%;
            box-sizing: border-box;
            border: 1px solid rgba(0,0,0,0.08);
            background: rgba(250,250,252,0.9);
            border-radius: 10px;
            padding: 10px 12px;
            font-family: inherit;
            font-size: 0.92rem;
            color: #1d1d1f;
            outline: none;
            -webkit-appearance: none;
            appearance: none;
            line-height: 1.45;
        }
        .design-group select {
            cursor: pointer;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23AEAEB2' d='M5 6L0 0h10z'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 14px center;
            padding-right: 36px;
        }
        .design-group textarea { min-height: 72px; resize: vertical; }
        .design-group input:focus,
        .design-group select:focus,
        .design-group textarea:focus {
            border-color: rgba(0,0,0,0.2);
            background: #fff;
            box-shadow: 0 0 0 3px rgba(0,0,0,0.04);
        }
        .design-group input::placeholder,
        .design-group textarea::placeholder { color: #C7C7CC; }
        #style_custom,
        #color_main_custom,
        #elements_other { margin-top: 8px; }
        .design-ratio { display: flex; flex-wrap: wrap; gap: 8px; }
        #design-section .design-ratio { display: grid; grid-template-columns: 1fr 1fr; }
        .design-ratio-btn {
            appearance: none; border: 1.5px solid rgba(0,0,0,0.12);
            background: #fff; color: #6e6e73;
            font-family: inherit; font-size: 0.8rem; font-weight: 600;
            padding: 8px 10px; border-radius: 10px; cursor: pointer;
            line-height: 1.3;
        }
        .design-ratio-btn.active {
            background: #1d1d1f; color: #fff; border-color: #1d1d1f;
        }
        .design-chips { display: flex; flex-wrap: wrap; gap: 6px; }
        .design-chip {
            appearance: none; border: 1px solid rgba(0,0,0,0.12);
            background: #fff; color: #48484a;
            font-family: inherit; font-size: 0.76rem; font-weight: 600;
            padding: 5px 10px; border-radius: 999px; cursor: pointer;
        }
        .design-chip.active {
            background: #1d1d1f; color: #fff; border-color: #1d1d1f;
        }
        .design-more-toggle {
            appearance: none; width: 100%;
            border: 1px dashed rgba(0,0,0,0.14);
            background: #fafafa; color: #1d1d1f;
            font-family: inherit; font-size: 0.9rem; font-weight: 700;
            padding: 12px 14px; border-radius: 12px; cursor: pointer;
            margin: 2px 0 8px;
            text-align: left;
        }
        .design-more-toggle:hover { background: #f5f5f7; }
        .design-more-panel { display: none; }
        .design-more-panel.open { display: block; }
        .design-person-fields {
            margin: 0 0 4px;
            padding: 12px 12px 2px;
            border-radius: 12px;
            background: #f7f8fa;
            border: 1px solid rgba(0,0,0,0.05);
        }
        .design-person-fields.hidden { display: none !important; }
        .design-ref-dropzone {
            position: relative;
            box-sizing: border-box;
            width: 100%;
            border: 1.5px dashed rgba(0,0,0,0.14);
            border-radius: 12px;
            background: #f5f5f7;
            padding: 22px 16px;
            cursor: pointer;
            transition: border-color 0.15s ease, background 0.15s ease;
            outline: none;
            user-select: none;
        }
        .design-ref-dropzone:hover,
        .design-ref-dropzone:focus-visible {
            border-color: rgba(0,0,0,0.28);
            background: #f0f0f2;
        }
        .design-ref-dropzone.is-dragover {
            border-color: rgba(0,0,0,0.4);
            border-style: solid;
            background: #ebebed;
        }
        .design-ref-dropzone.is-busy {
            opacity: 0.65;
            pointer-events: none;
        }
        .design-ref-dropzone.has-file {
            padding: 14px;
            cursor: default;
            background: #fafafa;
            border-style: solid;
            border-color: rgba(0,0,0,0.08);
        }
        .design-ref-dropzone.has-file:hover {
            border-color: rgba(0,0,0,0.14);
            background: #fafafa;
        }
        .design-ref-file-input {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }
        .design-ref-empty {
            text-align: center;
            pointer-events: none;
        }
        .design-ref-empty.hidden { display: none !important; }
        .design-ref-empty-title {
            margin: 0 0 6px;
            font-size: 0.95rem;
            font-weight: 600;
            color: #1d1d1f;
            letter-spacing: 0.01em;
        }
        .design-ref-empty-hint {
            margin: 0;
            font-size: 0.78rem;
            font-weight: 500;
            color: #AEAEB2;
            letter-spacing: 0.02em;
        }
        .design-ref-filled {
            display: flex;
            align-items: center;
            gap: 14px;
        }
        .design-ref-filled.hidden { display: none !important; }
        .design-ref-thumb {
            flex: 0 0 auto;
            width: 72px;
            height: 72px;
            border-radius: 10px;
            overflow: hidden;
            border: 1px solid rgba(0,0,0,0.08);
            background: #eee;
            cursor: zoom-in;
        }
        .design-ref-thumb img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            pointer-events: none;
        }
        .design-ref-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            align-items: center;
        }
        .design-ref-action {
            appearance: none;
            border: 1px solid rgba(0,0,0,0.12);
            background: #fff;
            color: #48484a;
            font-family: inherit;
            font-size: 0.84rem;
            font-weight: 600;
            padding: 7px 12px;
            border-radius: 10px;
            cursor: pointer;
            line-height: 1.2;
        }
        .design-ref-action:hover {
            border-color: rgba(0,0,0,0.22);
            color: #1d1d1f;
            background: #fff;
        }
        .design-ref-status {
            margin: 8px 0 0;
            font-size: 0.82rem;
            color: #6e6e73;
            min-height: 1.2em;
        }
        .design-ref-status.is-error { color: #c0392b; }
        .design-ref-mode-wrap {
            margin-top: 14px;
            padding-top: 2px;
            position: relative;
        }
        .design-ref-mode-wrap.hidden { display: none !important; }
        .design-ref-mode-label {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            margin: 0 0 10px;
            font-size: 1.02rem;
            font-weight: 600;
            color: #1D1D1F;
            letter-spacing: 0.01em;
        }
        .design-ref-mode-pills {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin: 0 0 10px;
        }
        .design-ref-mode-pill {
            appearance: none;
            border: 1.5px solid rgba(0,0,0,0.12);
            background: #fff;
            color: #6e6e73;
            font-family: inherit;
            font-size: 0.86rem;
            font-weight: 600;
            padding: 8px 14px;
            border-radius: 999px;
            cursor: pointer;
            line-height: 1.2;
        }
        .design-ref-mode-pill:hover {
            border-color: rgba(0,0,0,0.22);
            color: #1d1d1f;
        }
        .design-ref-mode-pill.active {
            background: #1d1d1f;
            color: #fff;
            border-color: #1d1d1f;
        }
        .design-ref-mode-select {
            position: absolute !important;
            width: 1px !important;
            height: 1px !important;
            padding: 0 !important;
            margin: -1px !important;
            overflow: hidden !important;
            clip: rect(0, 0, 0, 0) !important;
            white-space: nowrap !important;
            border: 0 !important;
            opacity: 0 !important;
            pointer-events: none !important;
        }
        #body_text { min-height: 120px; }
        #person_desc { min-height: 96px; }
        .design-hint {
            margin: 0 0 10px;
            font-size: 0.88rem; color: #6e6e73; line-height: 1.55;
        }
        .design-hint strong { color: #1d1d1f; }
        .design-gen-btn,
        #design-gen-btn,
        #ad-gen-btn {
            display: block;
            width: 100%;
            box-sizing: border-box;
            min-height: 50px;
            border: none; border-radius: 12px;
            background: #1d1d1f; color: #fff;
            font-family: inherit; font-size: 0.98rem; font-weight: 700;
            cursor: pointer;
            padding: 14px 16px;
        }
        .design-gen-btn:hover,
        #design-gen-btn:hover,
        #ad-gen-btn:hover { background: #000; }
        .design-gen-btn:disabled,
        #design-gen-btn:disabled,
        #ad-gen-btn:disabled { background: #d2d2d7; cursor: not-allowed; }

        #design-toast {
            position: fixed;
            left: 50%;
            bottom: 28px;
            transform: translateX(-50%) translateY(8px);
            z-index: 10055;
            max-width: min(420px, calc(100vw - 32px));
            padding: 10px 16px;
            border-radius: 12px;
            background: rgba(29,29,31,0.92);
            color: #fff;
            font-size: 0.86rem;
            font-weight: 600;
            line-height: 1.45;
            box-shadow: 0 10px 28px rgba(0,0,0,0.2);
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.2s ease, transform 0.2s ease;
        }
        #design-toast.show {
            opacity: 1;
            transform: translateX(-50%) translateY(0);
        }
        .design-result-placeholder {
            flex: 1;
            min-height: 100px;
            display: flex; align-items: center; justify-content: center;
            text-align: center;
            color: #aeaeb2; font-size: 0.92rem;
            background: rgba(255,255,255,0.55);
            border: 1px dashed rgba(0,0,0,0.1);
            border-radius: 14px;
            padding: 20px;
        }
        .design-result-ok {
            display: none;
            flex: 1;
            min-height: 0;
            flex-direction: column;
        }
        .design-result-ok.show { display: flex; }
        .design-result-placeholder.hidden { display: none; }
        .design-preview-frame {
            flex: 1;
            min-height: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(255,255,255,0.6);
            border: 1px solid rgba(0,0,0,0.06);
            border-radius: 12px;
            overflow: hidden;
        }
        .design-preview-frame img,
        #design-preview,
        #ad-preview {
            display: block;
            max-width: 100%;
            max-height: 100%;
            width: auto;
            height: auto;
            object-fit: contain;
            object-position: center;
            border-radius: 10px;
            cursor: zoom-in;
        }
        #ad-display-section:not(.hidden) .design-preview-frame img,
        #ad-display-section:not(.hidden) #ad-preview {
            max-width: 100% !important;
            max-height: 100% !important;
            width: auto !important;
            height: auto !important;
            object-fit: contain !important;
            object-position: center !important;
        }
        .design-result-actions {
            margin-top: 10px;
            display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
            flex-shrink: 0;
        }
        .design-download-btn {
            display: inline-flex; align-items: center; justify-content: center;
            min-height: 40px; padding: 0 16px;
            border-radius: 999px;
            background: #1d1d1f; color: #fff;
            text-decoration: none;
            font-size: 0.88rem; font-weight: 700;
        }
        .design-download-btn:hover { background: #000; }
        .design-result-meta {
            margin: 8px 0 0;
            font-size: 0.86rem; color: #6e6e73; line-height: 1.5;
            flex-shrink: 0;
        }
        .design-error {
            display: none;
            margin-top: 10px;
            padding: 10px 12px;
            border-radius: 12px;
            background: rgba(255,59,48,0.06);
            border: 1px solid rgba(255,59,48,0.16);
            color: #b42318;
            font-size: 0.88rem; line-height: 1.5;
            flex-shrink: 0;
        }
        .design-error.show { display: block; }
        #design-lightbox {
            display: none;
            position: fixed; inset: 0; z-index: 10040;
            align-items: center; justify-content: center;
            padding: 12px 16px;
            box-sizing: border-box;
        }
        #design-lightbox.open { display: flex; }
        #design-ref-lightbox {
            display: none;
            position: fixed; inset: 0; z-index: 10041;
            align-items: center; justify-content: center;
            padding: 12px 16px;
            box-sizing: border-box;
        }
        #design-ref-lightbox.open { display: flex; }
        .design-lightbox-backdrop {
            position: absolute; inset: 0;
            background: rgba(0,0,0,0.72);
            backdrop-filter: blur(4px);
        }
        .design-lightbox-panel {
            position: relative; z-index: 1;
            width: auto;
            max-width: min(96vw, 1400px);
            max-height: 92dvh;
            display: flex; flex-direction: column; align-items: center; justify-content: center;
            gap: 12px;
            box-sizing: border-box;
        }
        .design-lightbox-panel img {
            display: block;
            max-width: 100%;
            max-height: calc(92dvh - 80px);
            width: auto; height: auto;
            object-fit: contain;
            border-radius: 12px;
            box-shadow: 0 20px 60px rgba(0,0,0,0.35);
            background: #111;
        }
        .design-lightbox-actions {
            display: flex; gap: 10px; flex-wrap: wrap; justify-content: center;
            flex-shrink: 0;
        }
        .design-lightbox-close {
            appearance: none; border: none;
            background: #fff; color: #1d1d1f;
            border-radius: 999px;
            padding: 10px 18px;
            font-family: inherit; font-size: 0.9rem; font-weight: 700;
            cursor: pointer;
        }
        @media (max-width: 900px) {
            #design-lightbox { padding: 10px 12px; }
            .design-lightbox-panel {
                max-width: 96vw;
                max-height: 92dvh;
            }
            .design-lightbox-panel img {
                max-width: 100%;
                max-height: calc(92dvh - 80px);
                object-fit: contain;
            }
            .design-topbar-desc {
                white-space: normal;
                max-width: none;
            }
            html.design-workspace-open {
                height: auto;
                overflow: auto;
            }
            body.design-workspace-open {
                overflow-y: auto;
                height: auto;
                min-height: 100dvh;
            }
            .design-app-shell,
            #design-section {
                height: auto;
                overflow: visible;
            }
            .design-app-shell:not(.hidden),
            #design-section:not(.hidden) {
                display: block;
            }
            /* 广告布置窄屏仍固定贴边，仅内部改纵向堆叠；避免被上面规则打回“灰底卡片页” */
            #ad-display-section .ad-form-grid,
            #design-section .design-form-grid {
                grid-template-columns: 1fr;
            }
            #ad-display-section:not(.hidden) {
                position: fixed !important;
                inset: 0 !important;
                z-index: 1200 !important;
                width: 100vw !important;
                height: 100dvh !important;
                overflow: hidden !important;
                display: flex !important;
                flex-direction: column !important;
                background: #ffffff !important;
            }
            #ad-display-section:not(.hidden) .design-layout {
                height: calc(100dvh - 58px) !important;
                overflow-y: auto !important;
            }
            .design-topbar {
                position: sticky;
                top: 0;
            }
            .design-layout {
                display: flex;
                flex-direction: column;
                height: auto;
                overflow: visible;
            }
            .design-left {
                display: contents;
                border-right: none;
            }
            .design-chat {
                order: 1;
                min-height: 320px;
                max-height: 46vh;
                background: linear-gradient(165deg, #f8f9fb 0%, #eef1f5 100%);
                border-bottom: 1px solid rgba(0,0,0,0.06);
            }
            #design-section.design-assist-mode .design-chat,
            #ad-display-section.design-assist-mode .design-chat {
                max-height: none;
                min-height: 52vh;
                flex: 1 1 auto;
            }
            .design-chat-inputbar textarea {
                max-height: min(28vh, 220px);
            }
            .design-chat-resize-handle {
                height: 16px;
            }
            #design-section.design-assist-mode .design-assist-actions,
            #ad-display-section.design-assist-mode .design-assist-actions {
                padding-left: 20px;
                padding-right: 20px;
                flex-wrap: nowrap;
            }
            .design-assist-btn {
                flex: 1 1 0;
                min-width: 0;
                font-size: 0.76rem;
                padding: 7px 8px;
            }
            .design-assist-btn-apply,
            #design-assist-apply,
            #ad-assist-apply {
                flex: 1.15 1 0;
            }
            #design-section.design-assist-mode.has-gen-preview .design-chat,
            #ad-display-section.design-assist-mode.has-gen-preview .design-chat,
            #design-section.design-assist-mode:has(.design-result-ok.show) .design-chat,
            #ad-display-section.design-assist-mode:has(.design-result-ok.show) .design-chat {
                max-height: 46vh;
                min-height: 280px;
            }
            .design-right {
                order: 2;
                height: auto;
                overflow: visible;
                box-shadow: none;
            }
            .design-preview {
                order: 3;
                min-height: 280px;
                border-top: 1px solid rgba(0,0,0,0.06);
                background: #f2f3f5;
            }
            .design-chat-head,
            .design-chat-messages,
            .design-chat-inputbar,
            .design-preview-head,
            .design-result-scroll {
                padding-left: 20px;
                padding-right: 20px;
            }
            .design-right-head,
            .design-form-scroll,
            .design-form-footer {
                padding-left: 24px;
                padding-right: 24px;
            }
            .design-form-scroll {
                overflow: visible;
            }
            .design-form-footer {
                position: static;
            }
            .design-form-footer-actions {
                flex-direction: column;
            }
            #design-section:not(.hidden) .design-form-footer-actions #design-gen-btn,
            #ad-display-section:not(.hidden) .design-form-footer-actions #ad-gen-btn {
                width: 100% !important;
                flex: none !important;
            }
            .design-preview-frame {
                min-height: 220px;
            }
        }
        @media (max-width: 420px) {
            #design-section.design-assist-mode .design-assist-actions,
            #ad-display-section.design-assist-mode .design-assist-actions {
                flex-wrap: wrap;
            }
            .design-assist-btn {
                flex: 1 1 30%;
            }
            .design-assist-btn-apply,
            #design-assist-apply,
            #ad-assist-apply {
                flex: 1.2 1 34%;
            }
        }

        /* 开发中占位弹层 */        /* 开发中占位弹层 */
        #ws-coming-modal {
            display: none; position: fixed; inset: 0; z-index: 10030;
            align-items: center; justify-content: center;
            padding: 24px 16px; box-sizing: border-box;
        }
        #ws-coming-modal.open { display: flex; }
        .ws-coming-backdrop {
            position: absolute; inset: 0;
            background: rgba(0,0,0,0.42);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
        }
        .ws-coming-panel {
            position: relative; z-index: 1;
            width: min(440px, 92vw);
            background: #fff; border-radius: 18px;
            padding: 28px 26px 22px;
            box-shadow: 0 24px 64px rgba(0,0,0,0.2);
            text-align: left;
        }
        .ws-coming-panel h3 {
            margin: 0 0 10px; font-size: 1.15rem; font-weight: 800; color: #1d1d1f;
        }
        .ws-coming-panel p {
            margin: 0 0 22px; font-size: 0.95rem; line-height: 1.7; color: #6e6e73;
        }
        .ws-coming-ok {
            width: 100%; padding: 12px 16px;
            background: #1d1d1f; color: #fff; border: none; border-radius: 12px;
            font-family: inherit; font-size: 0.95rem; font-weight: 600; cursor: pointer;
        }
        .ws-coming-ok:hover { background: #000; }

        @media (max-width: 720px) {
            #workspace-select-section { padding: 16px 16px 36px; }
            .ws-topbar {
                margin-bottom: 12px;
                flex-direction: column;
                align-items: flex-start;
                position: static;
                padding: 0;
            }
            .ws-grid { grid-template-columns: 1fr; gap: 12px; }
            .ws-title { font-size: 1.35rem; }
            .ws-subtitle { margin-bottom: 12px; }
            .ws-section-title { margin-top: 20px; }
            .ws-card { padding: 16px 16px 14px; }
        }
        @media (min-width: 961px) and (max-height: 820px) {
            #workspace-select-section { padding: 14px 24px 20px; }
            .ws-topbar { margin-bottom: 10px; padding: 4px 0; }
            .ws-title { font-size: 1.3rem; margin-bottom: 4px; }
            .ws-subtitle { margin-bottom: 10px; font-size: 0.86rem; }
            .ws-section-title { margin: 14px 0 2px; font-size: 1.02rem; }
            .ws-section-title.ws-section-first { margin-top: 0; }
            .ws-section-sub { margin-bottom: 8px; font-size: 0.8rem; }
            .ws-grid { gap: 10px; }
            .ws-card { padding: 12px 14px 12px; gap: 6px; }
            .ws-card-title { font-size: 0.98rem; }
            .ws-card-desc { font-size: 0.8rem; line-height: 1.4; }
            .ws-card-btn { padding: 8px 12px; font-size: 0.84rem; margin-top: 2px; }
        }

        /* --- 智能体团队介绍页 --- */
        #team-intro-section {
            position: relative;
            isolation: isolate;
            width: 100%;
            min-height: 100dvh; padding: 10px 16px 20px;
            background-color: #f5f5f7;
            background-image:
                linear-gradient(rgba(0, 0, 0, 0.045) 1px, transparent 1px),
                linear-gradient(90deg, rgba(0, 0, 0, 0.045) 1px, transparent 1px);
            background-size: 28px 28px;
            box-sizing: border-box;
            display: flex; align-items: center; justify-content: center;
            overflow: hidden;
        }
        #team-intro-section::after {
            content: '';
            position: absolute; inset: 0;
            opacity: 0.28;
            background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
            background-size: 160px 160px;
            pointer-events: none;
            z-index: 0;
            mix-blend-mode: multiply;
        }
        body:has(#team-intro-section:not(.hidden)) {
            background: #f5f5f7; padding: 0; overflow: hidden;
            min-height: 100dvh;
        }
        body:has(#team-intro-section:not(.hidden)) .container {
            display: contents;
        }
        body:has(#team-intro-section:not(.hidden)) .logo,
        body:has(#team-intro-section:not(.hidden)) #login-layout,
        body:has(#team-intro-section:not(.hidden)) #workspace-select-section,
        body:has(#team-intro-section:not(.hidden)) #site-footer { display: none !important; }
        .team-intro-inner {
            position: relative; z-index: 1;
            max-width: min(96vw, 1600px); width: 100%; margin: 0 auto; text-align: center;
            display: flex; flex-direction: column; align-items: center;
            min-height: calc(100dvh - 30px); justify-content: center;
        }
        .team-intro-title { font-size: 1.45rem; font-weight: 700; color: #1d1d1f; margin: 0 0 8px; letter-spacing: -0.02em; }
        .team-intro-sub { font-size: 0.9rem; color: #86868b; margin: 0 0 20px; line-height: 1.45; }
        .team-badge-stack {
            position: relative;
            width: 100%; max-width: min(96vw, 1600px);
            --team-track-w: min(96vw, 1600px);
            --team-gap-min: 10px;
            --team-card-w: clamp(250px, calc((var(--team-track-w) - 5 * var(--team-gap-min)) / 6), 300px);
            --team-stack-w: clamp(250px, calc(var(--team-card-w) * 0.94), 282px);
            --team-card-h: calc(var(--team-card-w) * 330 / 250);
            --team-stack-h: calc(var(--team-stack-w) * 330 / 250);
            --team-item-h: calc(32px + var(--team-card-h));
            --team-item-h-stack: calc(32px + var(--team-stack-h) + 8px);
            --team-badge-w: var(--team-stack-w);
            height: var(--team-item-h-stack);
            margin: 0 auto clamp(24px, 3vh, 36px);
        }
        .team-badge-stack .team-badge-item {
            position: absolute;
            left: 50%; top: 50%;
            width: var(--team-badge-w);
            margin-left: calc(var(--team-badge-w) / -2);
            margin-top: calc(var(--team-item-h-stack) / -2);
            transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.55s ease;
            will-change: transform, opacity;
        }
        .team-badge-stack .agent-badge-scene,
        .team-badge-stack .agent-badge-flip {
            width: var(--team-badge-w);
            min-height: calc(var(--team-badge-w) * 330 / 250);
        }
        .team-badge-stack .agent-badge-namebar {
            padding: 11px 14px;
            font-size: clamp(1rem, calc(var(--team-badge-w) * 0.042), 1.2rem);
        }
        .team-badge-stack .agent-badge-body { padding: 16px 18px 14px; }
        .team-badge-stack .agent-badge-avatar-wrap {
            width: calc(var(--team-badge-w) * 0.31);
            height: calc(var(--team-badge-w) * 0.31);
            border-radius: 16px;
            margin-bottom: 12px;
        }
        .team-badge-stack .agent-badge-avatar {
            width: calc(var(--team-badge-w) * 0.22);
            height: calc(var(--team-badge-w) * 0.22);
        }
        .team-badge-stack .agent-badge-avatar svg {
            width: 100%; height: 100%;
        }
        .team-badge-stack .agent-badge-role-cn { font-size: clamp(0.95rem, calc(var(--team-badge-w) * 0.038), 1.1rem); }
        .team-badge-stack .agent-badge-role-en { font-size: clamp(0.72rem, calc(var(--team-badge-w) * 0.028), 0.84rem); margin-bottom: 11px; }
        .team-badge-stack .agent-badge-motto { font-size: clamp(0.82rem, calc(var(--team-badge-w) * 0.032), 0.94rem); margin-bottom: 13px; }
        .team-badge-stack .agent-badge-status { font-size: clamp(0.78rem, calc(var(--team-badge-w) * 0.03), 0.88rem); padding: 5px 14px; }
        .team-badge-stack .agent-badge-footer { padding: 11px 18px; font-size: clamp(0.75rem, calc(var(--team-badge-w) * 0.029), 0.84rem); }
        .team-badge-stack .agent-badge-detail-btn { font-size: clamp(0.78rem, calc(var(--team-badge-w) * 0.03), 0.88rem); }
        .team-badge-stack .agent-badge-back-body { padding: 16px 18px 18px; }
        .team-badge-stack .agent-badge-about { font-size: clamp(0.82rem, calc(var(--team-badge-w) * 0.032), 0.94rem); }
        .team-badge-stack .agent-badge-duties { font-size: clamp(0.78rem, calc(var(--team-badge-w) * 0.03), 0.88rem); }
        #team-intro-section .agent-badge-status {
            color: #6e6e73;
            background: rgba(0, 0, 0, 0.06);
        }
        /* 介绍页工牌：黑灰配色（不影响进度区绿色工牌） */
        #team-intro-section .agent-lanyard { background: #1D1D1F; }
        #team-intro-section .agent-badge-namebar { background: #1D1D1F; color: #fff; }
        #team-intro-section .agent-badge-front,
        #team-intro-section .agent-badge-back {
            background: #ffffff;
            box-shadow: 0 10px 32px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.04);
        }
        #team-intro-section .agent-badge-avatar { background: transparent; }
        #team-intro-section .agent-badge-role-en { color: #6e6e73; }
        #team-intro-section .agent-badge-footer { color: #86868b; }
        #team-intro-section .agent-badge-detail-btn { color: #48484a; }
        #team-intro-section .agent-badge-motto { color: #48484a; }
        #team-intro-section .agent-badge-about { color: #48484a; }
        #team-intro-section .agent-badge-duties { color: #48484a; }
        /* 堆叠态：更紧的 8–12px 错位，最上层完整可见 */
        .team-badge-stack:not(.expanded) .team-badge-item:nth-child(1) { transform: translate(-16px, -12px) rotate(-5deg); z-index: 1; opacity: 0.72; }
        .team-badge-stack:not(.expanded) .team-badge-item:nth-child(2) { transform: translate(-12px, -9px) rotate(-3deg); z-index: 2; opacity: 0.8; }
        .team-badge-stack:not(.expanded) .team-badge-item:nth-child(3) { transform: translate(-8px, -6px) rotate(-1.5deg); z-index: 3; opacity: 0.86; }
        .team-badge-stack:not(.expanded) .team-badge-item:nth-child(4) { transform: translate(-4px, -3px) rotate(-0.5deg); z-index: 4; opacity: 0.92; }
        .team-badge-stack:not(.expanded) .team-badge-item:nth-child(5) { transform: translate(-2px, -1px) rotate(0.5deg); z-index: 5; opacity: 0.96; }
        .team-badge-stack:not(.expanded) .team-badge-item:nth-child(6) { transform: translate(0, 0) rotate(0deg); z-index: 6; opacity: 1; }
        .team-badge-stack:not(.expanded) .agent-badge-flip {
            pointer-events: none; cursor: default;
        }
        /* 展开态：横排大卡，容器高度贴合牌面 */
        .team-badge-stack.expanded {
            --team-badge-w: var(--team-card-w);
            --team-gap: clamp(var(--team-gap-min), 1.2vw, 20px);
            --team-step-min: calc(var(--team-card-w) + var(--team-gap));
            --team-step-fill: calc((var(--team-track-w) - var(--team-card-w)) / 5);
            --team-step: max(var(--team-step-min), var(--team-step-fill));
            width: calc(5 * var(--team-step) + var(--team-card-w));
            max-width: var(--team-track-w);
            height: var(--team-item-h);
        }
        .team-badge-stack.expanded .team-badge-item {
            margin-top: calc(var(--team-item-h) / -2);
        }
        .team-badge-stack.expanded .team-badge-item:nth-child(1) { transform: translate(calc(-2.5 * var(--team-step)), 0) rotate(0deg); z-index: 1; opacity: 1; }
        .team-badge-stack.expanded .team-badge-item:nth-child(2) { transform: translate(calc(-1.5 * var(--team-step)), 0) rotate(0deg); z-index: 2; opacity: 1; }
        .team-badge-stack.expanded .team-badge-item:nth-child(3) { transform: translate(calc(-0.5 * var(--team-step)), 0) rotate(0deg); z-index: 3; opacity: 1; }
        .team-badge-stack.expanded .team-badge-item:nth-child(4) { transform: translate(calc(0.5 * var(--team-step)), 0) rotate(0deg); z-index: 4; opacity: 1; }
        .team-badge-stack.expanded .team-badge-item:nth-child(5) { transform: translate(calc(1.5 * var(--team-step)), 0) rotate(0deg); z-index: 5; opacity: 1; }
        .team-badge-stack.expanded .team-badge-item:nth-child(6) { transform: translate(calc(2.5 * var(--team-step)), 0) rotate(0deg); z-index: 6; opacity: 1; }
        .team-badge-stack.expanded .agent-badge-flip {
            pointer-events: auto; cursor: pointer;
        }
        .team-badge-stack.expanding .agent-badge-flip { pointer-events: none; }
        .team-intro-actions {
            display: flex; flex-direction: column; align-items: center; gap: 12px;
            max-width: 340px; margin: 0 auto; position: relative; z-index: 2;
        }
        #team-intro-section .team-intro-actions .btn {
            background: #1D1D1F; color: #fff; box-shadow: none;
        }
        #team-intro-section .team-intro-actions .btn:hover {
            background: #3a3a3c; transform: scale(1.02);
            box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
        }
        #team-intro-section .team-intro-actions .btn:disabled {
            background: #D2D2D7; color: #fff; box-shadow: none;
        }
        #team-intro-section .team-intro-actions .btn-outline {
            background: #fff; color: #48484a;
            border: 1px solid rgba(0, 0, 0, 0.12);
        }
        #team-intro-section .team-intro-actions .btn-outline:hover {
            background: #f5f5f7; color: #1D1D1F;
            border-color: rgba(0, 0, 0, 0.2);
            box-shadow: none;
        }
        .team-intro-actions .btn { margin-top: 0; width: 100%; padding: 15px 20px; font-size: 1rem; }
        .team-intro-actions .btn-outline { width: 100%; margin-top: 0; padding: 13px 20px; font-size: 0.95rem; }
        .team-intro-actions .btn:disabled { opacity: 0.65; cursor: not-allowed; transform: none; }
        .team-intro-back-btn {
            display: inline-block;
            margin-top: clamp(36px, 5vh, 52px);
            padding: 11px 28px;
            background: #fafafa;
            color: #48484a;
            border: 1px solid rgba(0, 0, 0, 0.14);
            border-radius: 12px;
            font-size: 0.92rem; font-weight: 600;
            font-family: inherit; cursor: pointer;
            transition: background 0.2s, color 0.2s, border-color 0.2s;
            width: auto; min-width: 168px;
        }
        .team-intro-back-btn:hover {
            background: #f0f0f2; color: #1D1D1F;
            border-color: rgba(0, 0, 0, 0.22);
        }
        .team-intro-back-btn:active { background: #e8e8ed; }
        @media (max-width: 768px) {
            body:has(#team-intro-section:not(.hidden)) {
                overflow-x: hidden;
                overflow-y: auto;
            }
            #team-intro-section {
                overflow-x: hidden;
                overflow-y: auto;
                -webkit-overflow-scrolling: touch;
                align-items: flex-start;
                padding: 16px 12px 28px;
            }
            .team-intro-inner {
                min-height: auto;
                justify-content: flex-start;
                padding-top: 12px;
                width: 100%;
                max-width: 100%;
                box-sizing: border-box;
            }
            .team-intro-title { font-size: 1.25rem; padding: 0 4px; }
            .team-intro-sub { font-size: 0.85rem; margin-bottom: 16px; padding: 0 4px; }
            .team-badge-stack {
                --team-stack-w: min(280px, 78vw);
                --team-card-w: min(280px, 78vw);
                --team-stack-h: calc(var(--team-stack-w) * 330 / 250);
                --team-card-h: calc(var(--team-card-w) * 330 / 250);
                --team-item-h-stack: calc(32px + var(--team-stack-h) + 8px);
                width: 100%;
                max-width: 100%;
                height: var(--team-item-h-stack);
                min-height: var(--team-item-h-stack);
                margin-bottom: clamp(20px, 3vh, 28px);
                box-sizing: border-box;
            }
            .team-badge-stack:not(.expanded) { height: var(--team-item-h-stack); }
            .team-badge-stack.expanded {
                /* 覆盖桌面展开态超宽 width，避免横向溢出 */
                --team-badge-w: min(300px, 92vw);
                --team-card-w: var(--team-badge-w);
                --team-card-h: calc(var(--team-badge-w) * 330 / 250);
                --team-item-h: calc(32px + var(--team-card-h));
                width: 100% !important;
                max-width: 100% !important;
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 14px;
                min-height: 0;
                height: auto !important;
                padding: 0;
                box-sizing: border-box;
            }
            .team-badge-stack.expanded .team-badge-item {
                position: relative !important;
                left: auto !important;
                top: auto !important;
                margin: 0 !important;
                margin-left: 0 !important;
                margin-top: 0 !important;
                width: var(--team-badge-w);
                max-width: 100%;
                transform: none !important;
                opacity: 1 !important;
                transition: opacity 0.45s ease, transform 0.45s ease;
            }
            .team-badge-stack.expanded .agent-badge-scene,
            .team-badge-stack.expanded .agent-badge-flip {
                width: 100%;
                max-width: none;
                min-height: var(--team-card-h);
                margin: 0 auto;
            }
            .team-badge-stack.expanded .agent-lanyard {
                display: none;
            }
            .team-intro-actions {
                max-width: min(340px, 92vw);
                width: 100%;
            }
            .team-intro-back-btn {
                margin-top: 24px;
            }
        }
        @keyframes status-breathe {
            0%,100% { box-shadow: 0 4px 20px rgba(0,0,0,0.06), 0 0 0 0   rgba(29,29,31,0.06); }
            50%     { box-shadow: 0 6px 28px rgba(0,0,0,0.10), 0 0 0 6px  rgba(29,29,31,0.08); }
        }
        @keyframes status-slidein {
            from { opacity: 0; transform: translateY(5px); }
            to   { opacity: 1; transform: translateY(0); }
        }
        .status-inner { display: inline-block; animation: status-slidein 0.32s ease forwards; }
        .required::after { content: " *"; color: #FF3B30; }

        /* --- 提取独立样式以便于移动端覆盖 --- */
        #verify-title { margin-top:0; color:var(--text-main); font-size: 1.8rem; letter-spacing: -0.02em; }
        #verify-desc { color: var(--text-sub); font-size: 1.05rem; line-height: 1.6; margin-bottom: 40px; }
        #verify-code { text-align: center; font-size: 1.8rem; letter-spacing: 0.5em; padding: 20px; font-weight: 700; }
        #form-title { margin-top:10px; color:var(--text-main); text-align:center; margin-bottom:32px; font-weight: 700; font-size: 1.5rem; letter-spacing: -0.01em; }

        /* ========================================================
           对话系统 
           ======================================================== */
        .chat-container { display: flex; flex-direction: column; height: 85vh; max-height: 820px; background: #ffffff; }
        .chat-header { 
            padding: 20px; text-align: center; border-bottom: 1px solid rgba(0,0,0,0.04); 
            font-weight: 700; font-size: 1.1rem; color: var(--text-main); 
            background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
            display: flex; justify-content: space-between; align-items: center;
        }
        .chat-header .close-btn { font-size: 1.6rem; cursor: pointer; color: var(--text-sub); font-weight: 300; transition: color 0.2s; }
        .chat-messages { flex: 1; overflow-y: auto; padding: 24px 20px; background: #ffffff; display: flex; flex-direction: column; gap: 16px; }
        .msg-bubble { max-width: 82%; padding: 12px 18px; font-size: 1rem; line-height: 1.5; word-wrap: break-word; white-space: pre-wrap; }
        .msg-ai { align-self: flex-start; background: #F5F5F7; color: #000000; border-radius: 18px 18px 18px 4px; }
        .msg-user { align-self: flex-end; background: var(--accent-green); color: #ffffff; border-radius: 18px 18px 4px 18px; }
        .chat-input-area { padding: 20px; background: #ffffff; border-top: 1px solid rgba(0,0,0,0.04); display: flex; gap: 10px; align-items: center;}
        .chat-input-area input { margin: 0; border-radius: 999px; padding: 14px 20px; background: var(--bg-color); border: 1px solid rgba(0,0,0,0.1);}
        .chat-input-area button { 
            width: 50px; height: 50px; border-radius: 50%; padding: 0; margin: 0; 
            display: flex; justify-content: center; align-items: center; flex-shrink: 0;
            background: var(--accent-green); color: #fff; font-size: 1.25rem;
            transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
        }
        .chat-input-area button:hover { transform: scale(1.05); background: var(--accent-green-hover); }
        .chat-input-area button:active { transform: scale(0.9); }
        /* 确认派单等全宽操作按钮：长方形圆角，覆盖上方圆形规则 */
        #chat-action-btn-wrap .btn,
        #chat-confirm-area .btn {
            width: 100% !important;
            height: auto !important;
            border-radius: 14px !important;
            padding: 16px 24px !important;
            display: block !important;
        }
        #chat-confirm-area { padding: 24px 20px; text-align: center; background: #ffffff; border-top: 1px solid rgba(0,0,0,0.04); }

        .loading-dots:after { content: '.'; animation: dots 1.5s steps(5, end) infinite;}
        @keyframes dots { 0%, 20% { color: rgba(0,0,0,0); text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0);} 40% { color: var(--text-sub); text-shadow: .25em 0 0 rgba(0,0,0,0), .5em 0 0 rgba(0,0,0,0);} 60% { text-shadow: .25em 0 0 var(--text-sub), .5em 0 0 rgba(0,0,0,0);} 80%, 100% { text-shadow: .25em 0 0 var(--text-sub), .5em 0 0 var(--text-sub);}}

        /* ========================================================
           📱 移动端极限响应式适配 (核心突破点)
           当屏幕宽度小于 600px 时，自动接管布局
           ======================================================== */
        @media (max-width: 960px) {
            .login-layout {
                justify-content: flex-start;
                padding-right: 0;
                align-items: stretch;
            }
            .login-anchor {
                width: 100%;
                max-width: 100%;
            }
            .login-layout .login-box {
                margin-bottom: 0;
            }
        }

        @media (max-width: 600px) {
            body { padding: 15px 12px; }
            body:has(#login-layout:not(.hidden)) { padding: 0; }
            .box-content { padding: 30px 20px; }
            .login-layout .login-box { width: 100%; }
            
            /* 文字智能缩放，杜绝换行 */
            .logo { font-size: 4.2rem; margin-bottom: 16px; }
            .slogan-main { font-size: 1.6rem; }
            .slogan-sub { font-size: 1rem; }
            
            #verify-title { font-size: 1.5rem; }
            #verify-desc { font-size: 0.95rem; margin-bottom: 30px; }
            #verify-code { font-size: 1.4rem; letter-spacing: 0.3em; padding: 16px; }
            
            #form-title { font-size: 1.3rem; margin-bottom: 24px; }
            
            /* 表单元素微调 */
            input, textarea, select { padding: 14px; font-size: 0.95rem; }
            .btn { padding: 16px; font-size: 1.05rem; margin-top: 24px; }
            
            /* 用户信息条防拥挤 */
            #user-info-bar { flex-direction: column; align-items: flex-start; gap: 8px; }
            
            /* 对话系统瘦身 */
            .chat-messages { padding: 16px 15px; }
            .msg-bubble { max-width: 88%; font-size: 0.95rem; padding: 10px 14px; }
            .chat-input-area { padding: 15px; }
            .chat-input-area button { width: 44px; height: 44px; }
            .chat-header { padding: 16px; }

            /* 智能体卡片移动端竖排 & 紧凑布局 */
            .agent-cards { flex-direction: column !important; gap: 12px !important; }
            .agent-select-eyebrow { margin-bottom: 6px !important; font-size: 0.72rem !important; }
            .agent-select-title { font-size: 1.4rem !important; margin-bottom: 4px !important; }
            .agent-select-subtitle { font-size: 0.88rem !important; margin-bottom: 20px !important; }
            .agent-card { padding: 20px 18px 18px !important; }
            .agent-card-icon { font-size: 2.2rem !important; margin-bottom: 10px !important; }
            .agent-card-title { font-size: 1.1rem !important; margin-bottom: 6px !important; }
            .agent-card-desc { font-size: 0.82rem !important; margin-bottom: 14px !important; }
            .agent-select-back { margin-top: 20px !important; }

            /* 移动端：显示智能体选择时锁死滚动 */
            body:has(#agent-select-section:not(.hidden)) {
                overflow: hidden !important;
                height: 100dvh !important;
            }
            body:has(#agent-select-section:not(.hidden)) .logo { display: none !important; }
            body:has(#agent-select-section:not(.hidden)) #site-footer { display: none !important; }
            body:has(#agent-select-section:not(.hidden)) .container {
                height: 100dvh !important;
                overflow: hidden !important;
                padding: 0 !important;
                display: flex !important;
                flex-direction: column !important;
                align-items: center !important;
                justify-content: center !important;
            }

                        /* ── 移动端：去底图，纯色 iOS 质感背景 ── */
            body {
                background-image: none !important;
                background-color: #f5f5f7 !important;
            }
            /* 登录卡片居中，两侧留安全边距 */
            .login-box {
                margin-left: auto !important;
                margin-right: auto !important;
                width: calc(100% - 32px) !important;
                max-width: 420px !important;
            }

            /* ── 移动端 AI 聊天界面：全屏沉浸式（兼容所有浏览器）── */

            /* 直接选中 #chat-section 内的 container，无需 :has() */
            #chat-section {
                width: 100% !important;
                max-width: 100% !important;
                margin: 0 !important;
                padding: 0 !important;
                border-radius: 0 !important;
                border: none !important;
                box-shadow: none !important;
                background: #f5f5f7 !important;
            }

            /* chat-container 撑满整个视口高度 */
            #chat-section .chat-container {
                display: flex !important;
                flex-direction: column !important;
                height: 100dvh !important;
                max-height: none !important;
                width: 100% !important;
                border-radius: 0 !important;
                border: none !important;
                box-shadow: none !important;
                background: #f5f5f7 !important;
                overflow: hidden !important;
            }

            /* 消息区弹性撑满，自身滚动 */
            #chat-section .chat-messages {
                flex: 1 !important;
                overflow-y: auto !important;
                -webkit-overflow-scrolling: touch !important;
                background: #f5f5f7 !important;
            }

            /* 输入框区域钉在底部，永不被挤走 */
            #chat-section .chat-input-area {
                flex-shrink: 0 !important;
                background: #ffffff !important;
                border-top: 1px solid rgba(0,0,0,0.06) !important;
            }

            /* :has() 支持的浏览器额外隐藏 logo 和去 body 留白 */
            body:has(#chat-section:not(.hidden)) {
                padding: 0 !important;
                overflow: hidden !important;
            }
            body:has(#chat-section:not(.hidden)) .logo { display: none !important; }
            body:has(#chat-section:not(.hidden)) .container {
                max-width: 100% !important;
                width: 100% !important;
                padding: 0 !important;
            }

            /* 移动端隐藏页脚，避免影响聊天全屏体验 */
            #site-footer { display: none !important; }

            /* ── 登录页全屏兜底（不依赖 :has()，兼容微信浏览器）── */
            #login-layout:not(.hidden) {
                height: 100dvh !important;
                overflow: hidden !important;
            }
            #login-layout:not(.hidden) .login-anchor {
                height: 100% !important;
                overflow: hidden !important;
            }
            #login-layout:not(.hidden) #login-section {
                width: 100% !important;
                height: 100% !important;
                margin: 0 !important;
                border-radius: 0 !important;
                border: none !important;
                box-shadow: none !important;
                backdrop-filter: none !important;
                -webkit-backdrop-filter: none !important;
                background: #ffffff !important;
                overflow-y: auto !important;
            }

            /* ── 授权验证页兜底（不依赖 :has()，兼容微信浏览器）── */
            #verify-section:not(.hidden) {
                position: fixed !important;
                inset: 0 !important;
                z-index: 100 !important;
                overflow-y: auto !important;
                overscroll-behavior: none !important;
                -webkit-overflow-scrolling: touch !important;
                background: #f5f5f7 !important;
                display: flex !important;
                flex-direction: column !important;
                align-items: center !important;
                justify-content: center !important;
                border-radius: 0 !important;
                box-shadow: none !important;
                border: none !important;
                max-width: 100% !important;
                width: 100% !important;
                margin: 0 !important;
                box-sizing: border-box !important;
            }
            #verify-section:not(.hidden) .box-content {
                width: 100% !important;
                max-width: 420px !important;
                background: #ffffff !important;
                border-radius: 20px !important;
                padding: 36px 28px !important;
                box-sizing: border-box !important;
                box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
            }

            /* ── 智能体选择页兜底（不依赖 :has()，兼容微信浏览器）── */
            #agent-select-section:not(.hidden) {
                position: fixed !important;
                inset: 0 !important;
                z-index: 100 !important;
                overflow-y: auto !important;
                overscroll-behavior: none !important;
                -webkit-overflow-scrolling: touch !important;
                background: #f5f5f7 !important;
                display: flex !important;
                flex-direction: column !important;
                align-items: center !important;
                justify-content: flex-start !important;
                padding: 28px 16px 32px !important;
                box-sizing: border-box !important;
            }
            /* 内容区域垂直居中（内容较少时）*/
            #agent-select-section:not(.hidden) > * {
                width: 100% !important;
            }
        }

        /* ════════════════════════════════════════════════════════
           📱 手机端沉浸式登录体验 — 仅追加，不覆盖 PC 样式
           ════════════════════════════════════════════════════════ */
        @media (max-width: 768px) {

            /* ── 全局 body ── */
            html, body {
                min-height: 100vh;
                overflow-x: hidden;
            }
            body:has(#login-layout:not(.hidden)) {
                padding: 0;
                display: flex;
                flex-direction: column;
                justify-content: flex-start;
                align-items: stretch;
                height: 100dvh;
                overflow: hidden;
                background-color: #f5f5f7;
                background-image:
                    linear-gradient(rgba(29, 29, 31, 0.035) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(29, 29, 31, 0.035) 1px, transparent 1px);
                background-size: 36px 36px;
                background-attachment: fixed;
            }

            /* ── 容器纵向排列 ── */
            body:has(#login-layout:not(.hidden)) .container {
                display: flex;
                flex-direction: column;
                justify-content: flex-start;
                align-items: stretch;
                height: 100dvh;
                padding: 0;
                max-width: 100%;
                width: 100%;
                overflow: hidden;
            }

            /* ── logo 隐藏（背景图已作视觉）── */
            body:has(#login-layout:not(.hidden)) .logo { display: none; }

            /* ── 登录区填满高度 ── */
            body:has(#login-layout:not(.hidden)) .login-layout {
                display: flex;
                flex-direction: column;
                justify-content: flex-start;
                align-items: stretch;
                padding: calc(54px + env(safe-area-inset-top, 0px)) 0 0;
                width: 100%;
                flex: 1;
                overflow: hidden;
                background: #ffffff;
            }
            body:has(#login-layout:not(.hidden)) .login-layout::before,
            body:has(#login-layout:not(.hidden)) .login-layout::after {
                display: none !important;
            }
            body:has(#login-layout:not(.hidden)) .login-visual,
            body:has(#login-layout:not(.hidden)) .login-glow-main,
            body:has(#login-layout:not(.hidden)) .login-glow-soft,
            body:has(#login-layout:not(.hidden)) .login-dots-layer,
            body:has(#login-layout:not(.hidden)) .login-bridge-glow {
                display: none !important;
            }
            body:has(#login-layout:not(.hidden)) .login-anchor {
                width: 100%;
                max-width: 100%;
                flex: 1;
                overflow: hidden;
            }

            /* 侧栏不显示 */
            body:has(#login-layout:not(.hidden)) .side-panel { display: none !important; }

            /* ── 顶栏：干净实底 ── */
            body:has(#login-layout:not(.hidden)) .login-topbar {
                position: fixed;
                z-index: 30;
                background: #ffffff;
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
                border-bottom: 1px solid rgba(0,0,0,0.08);
                box-shadow: none;
            }

            /* ── 登录卡片全屏铺满 ── */
            body:has(#login-layout:not(.hidden)) #login-section {
                width: 100%;
                height: 100%;
                margin: 0;
                border-radius: 0;
                overflow-y: auto;
                overflow-x: hidden;
                border: none;
                background: #ffffff;
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
                box-shadow: none;
                transform: none;
                animation: none;
            }

            /* ── 卡片内容区 ── */
            body:has(#login-layout:not(.hidden)) #login-section .box-content {
                padding: 32px 24px 36px;
                display: flex;
                flex-direction: column;
                gap: 0;
                max-width: 440px;
                margin: 0 auto;
                width: 100%;
                box-sizing: border-box;
            }

            /* ── 品牌标题缩小防折行 ── */
            body:has(#login-layout:not(.hidden)) .login-brand-title {
                font-size: 1.8rem;
                margin-bottom: 2px;
                margin-top: 4px;
            }
            body:has(#login-layout:not(.hidden)) .slogan-main {
                font-size: 0.9rem;
                margin-bottom: 20px;
            }
            body:has(#login-layout:not(.hidden)) .slogan-container { margin-bottom: 0; }

            /* ── label 间距 ── */
            body:has(#login-layout:not(.hidden)) label {
                font-size: 0.88rem;
                margin-top: 14px;
                margin-bottom: 6px;
            }

            /* ── 输入框：最低 44px 触控高度 ── */
            body:has(#login-layout:not(.hidden)) input[type="text"],
            body:has(#login-layout:not(.hidden)) input[type="password"] {
                min-height: 48px;
                padding: 13px 16px;
                font-size: 1rem;
                border-radius: 14px;
            }

            /* ── 主操作按钮 100% 宽 ── */
            body:has(#login-layout:not(.hidden)) .btn {
                width: 100%;
                min-height: 52px;
                font-size: 1.05rem;
                margin-top: 18px;
                border-radius: 999px;
            }
            body:has(#login-layout:not(.hidden)) .btn-outline {
                min-height: 48px;
                margin-top: 10px;
                border-color: rgba(0,0,0,0.22);
                background: #fff;
            }

            /* ── 分隔线区域 ── */
            body:has(#login-layout:not(.hidden)) .box-content > div[style*="margin-top"] {
                margin-top: 16px !important;
            }
            body:has(#login-layout:not(.hidden)) .box-content hr { margin: 10px 0 !important; }

            /* ── iPhone 底部安全区留白 ── */
            body:has(#login-layout:not(.hidden)) .box-content {
                padding-bottom: calc(28px + env(safe-area-inset-bottom, 0px));
            }
        }