
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
            background: #eef2f5;
            color: #1a2c3e;
            padding: 1rem;
        }
        .selector-container {
            max-width: 1400px;
            margin: 0 auto;
            background: white;
            border-radius: 1.5rem;
            box-shadow: 0 12px 30px rgba(0,0,0,0.05);
            overflow: hidden;
            border: 1px solid #dce9f0;
        }
        .header {
            background: #0b5e7e;
            color: white;
            padding: 1.2rem 1.2rem;
        }
        .header h1 {
            font-size: 1.5rem;
            font-weight: 600;
            margin-bottom: 0.25rem;
            letter-spacing: -0.2px;
        }
        .header p {
            opacity: 0.85;
            font-size: 0.85rem;
        }
        .two-columns {
            display: flex;
            flex-wrap: wrap;
        }
        .modules-panel {
            flex: 2;
            min-width: 0; /* 防止溢出 */
            padding: 1.2rem;
            background: #fefefe;
            border-right: 1px solid #e2edf3;
        }
        .summary-panel {
            flex: 1.2;
            min-width: 0;
            background: #f8fbfd;
            padding: 1.2rem;
        }
        .section-title {
            font-weight: 600;
            font-size: 1.2rem;
            margin-bottom: 0.8rem;
            color: #124c63;
            border-left: 4px solid #35a7c2;
            padding-left: 0.75rem;
        }
        .filter-bar {
            margin-bottom: 1.2rem;
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
            align-items: center;
        }
        .filter-btn {
            background: #e9f0f4;
            border: none;
            padding: 0.4rem 0.9rem;
            border-radius: 40px;
            font-size: 0.75rem;
            font-weight: 500;
            cursor: pointer;
            transition: all 0.2s;
            color: #1e5a6e;
            font-family: inherit;
            white-space: nowrap;
        }
        .filter-btn.active {
            background: #1c7e9c;
            color: white;
        }
        .modules-grid {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
            gap: 0.8rem;
            max-height: 520px;
            overflow-y: auto;
            padding-right: 0.3rem;
        }
        .module-card {
            background: white;
            border: 1px solid #e0edf2;
            border-radius: 1rem;
            padding: 0.8rem;
            transition: all 0.2s;
            cursor: pointer;
            position: relative;
        }
        .module-card.selected {
            border-color: #1c7e9c;
            background: #f0f9fe;
            box-shadow: 0 4px 12px rgba(28,126,156,0.15);
        }
        .module-card.disabled {
            opacity: 0.55;
            background: #f9f9f9;
            cursor: not-allowed;
            pointer-events: none;
        }
        .module-title {
            display: flex;
            justify-content: space-between;
            align-items: baseline;
            flex-wrap: wrap;
            margin-bottom: 0.3rem;
        }
        .model-code {
            font-weight: 700;
            font-size: 1rem;
            color: #135c78;
            font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
        }
        .slot-badge {
            background: #e2f0f5;
            padding: 0.2rem 0.5rem;
            border-radius: 20px;
            font-size: 0.65rem;
            font-weight: 500;
        }
        .module-desc {
            font-size: 0.75rem;
            color: #2c3e50;
            margin: 0.4rem 0;
        }
        .io-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 0.3rem;
            margin-top: 0.3rem;
        }
        .tag {
            background: #eef2f5;
            font-size: 0.65rem;
            padding: 0.15rem 0.5rem;
            border-radius: 12px;
            color: #1f5e74;
        }
        .selected-list {
            list-style: none;
            margin: 0.8rem 0;
        }
        .selected-item {
            background: white;
            border-radius: 0.9rem;
            padding: 0.6rem 0.8rem;
            margin-bottom: 0.5rem;
            display: flex;
            justify-content: space-between;
            align-items: center;
            border: 1px solid #cde3ec;
            font-size: 0.85rem;
        }
        .slot-label {
            font-size: 0.65rem;
            background: #e2f0f5;
            padding: 0.15rem 0.45rem;
            border-radius: 20px;
            margin-left: 0.5rem;
            font-weight: normal;
        }
        .remove-btn {
            background: none;
            border: none;
            font-size: 1.1rem;
            cursor: pointer;
            color: #a94442;
            font-weight: bold;
            font-family: monospace;
            padding: 0 0.2rem;
        }
        .info-box {
            background: #e7f2f6;
            border-radius: 1rem;
            padding: 0.8rem;
            margin: 0.8rem 0;
            font-size: 0.75rem;
        }
        .reset-btn {
            background: #e0eef4;
            color: #124c63;
            padding: 0.35rem 1rem;
            border-radius: 30px;
            border: none;
            margin-top: 0.2rem;
            cursor: pointer;
            font-weight: 500;
            font-family: inherit;
            font-size: 0.8rem;
        }
        .config-preview-box {
            background: #1f2e36;
            color: #cde3ec;
            font-family: 'SF Mono', Monaco, 'Cascadia Code', monospace;
            padding: 0.7rem;
            border-radius: 14px;
            font-size: 0.7rem;
            word-break: break-word;
            white-space: pre-wrap;
            margin-top: 0.8rem;
        }
        footer {
            background: #f1f6f9;
            padding: 0.8rem 1rem;
            font-size: 0.7rem;
            text-align: center;
            color: #4f7e92;
            border-top: 1px solid #dce9f0;
        }
        /* 手机端完全响应式 */
        @media (max-width: 760px) {
            body { padding: 0.6rem; }
            .two-columns { flex-direction: column; }
            .modules-panel { border-right: none; border-bottom: 1px solid #e2edf3; }
            .modules-grid { grid-template-columns: 1fr; max-height: 480px; }
            .summary-panel { padding: 1rem; }
            .header h1 { font-size: 1.3rem; }
            .filter-btn { white-space: normal; font-size: 0.7rem; padding: 0.3rem 0.7rem; }
        }
        /* 小手机进一步优化 */
        @media (max-width: 480px) {
            .module-card { padding: 0.7rem; }
            .model-code { font-size: 0.9rem; }
            .module-desc { font-size: 0.7rem; }
        }
    