*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif}

    :root{
      --primary:#3498db;
      --secondary:#2c3e50;
      --light:#f5f7fa;
      --dark:#34495e;
      --success:#2ecc71;
      --warning:#f39c12;
      --danger:#e74c3c;
      --chip:#eef2f7;
      --border:#e5e7eb;
      
      /* 主题颜色 - 新增两个应用的颜色 */
      --theme-trilium:#1abc9c;        /* 笔记绿色 */
      --theme-odoo:#9b59b6;          /* Odoo紫色 */
      --theme-calculator:#e67e22;    /* 计算器橙色 */
      --theme-pdf:#e74c3c;           /* PDF红色 */
      --theme-cloud:#3498db;         /* 云盘蓝色 */
      --theme-knowledge:#f1c40f;     /* 知识库黄色 */
      --theme-photos:#1abc9c;        /* 相册青色 */
      --theme-blog:#34495e;          /* 博客深蓝灰 */
      --theme-minecraft:#5db252;     /* Minecraft绿色 */
      --theme-mods:#9b59b6;          /* Mods紫色 */
      --theme-links:#e74c3c;         /* 链接管理红色 */
      --theme-llm:#3498db;           /* LLM工具蓝色 */
      
      /* 律师办公专用主题色 */
      --law-pending:#1e5a4a;
      --law-treasure:#e67e22;
      --law-ai:#8b5cf6;
      --law-idcard:#3498db;
      --law-juanzong:#2c6288;
      --law-hetong:#16a085;
      --law-yingxiang:#e74c3c;
      --law-stats:#0b5fa4;      /* 赔偿标准数据(历年工资·居民收入) 深蓝 */
      --law-gs:#12796b;         /* 工伤赔偿标准(待遇依据·基数) 青绿 */
    }

    /* 动态壁纸容器 */
    .wallpaper-container {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: -1;
      overflow: hidden;
    }
    
    /* 壁纸样式 */
    .wallpaper {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      opacity: 0;
      transition: opacity 1s ease-in-out;
    }
    
    .wallpaper.active {
      opacity: 0.35; /* 降低不透明度避免影响内容阅读 */
    }
    
    /* CSS动画壁纸样式 */
    .css-wallpaper {
      background: linear-gradient(45deg, #3498db, #9b59b6, #e74c3c, #f39c12);
      background-size: 400% 400%;
      animation: gradientShift 15s ease infinite;
    }
    
    @keyframes gradientShift {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }
    
    /* 壁纸控制面板 */
    .wallpaper-controls {
      position: fixed;
      bottom: 20px;
      right: 20px;
      display: flex;
      gap: 10px;
      background: rgba(255, 255, 255, 0.8);
      padding: 10px;
      border-radius: 20px;
      backdrop-filter: blur(5px);
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      z-index: 1000;
    }
    
    .wallpaper-btn {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      border: none;
      cursor: pointer;
      background-size: cover;
      background-position: center;
      transition: transform 0.3s, box-shadow 0.3s;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: bold;
      color: #333;
    }
    
    .wallpaper-btn:hover {
      transform: scale(1.1);
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    }
    
    .wallpaper-btn.active {
      box-shadow: 0 0 0 3px var(--primary);
    }

    body {
      background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
      color: #333;
      line-height: 1.6;
      min-height: 100vh;
      margin: 0;
      padding: 0;               /* 2026-09-10: 归零, 让登录状态栏通栏 */
      position: relative;
    }
    
    .container {
      max-width: 1400px;
      margin: 0 auto;
      padding: 20px;            /* 2026-09-10: 承接原 body 的留白 */
      position: relative;
      z-index: 1;
    }

    header {
      text-align: center;
      padding: 40px 0;
      margin-bottom: 30px;
    }
    
    h1 {
      font-size: 2.5rem;
      color: var(--secondary);
      margin-bottom: 10px;
    }
    
    .subtitle {
      font-size: 1.2rem;
      color: #7f8c8d;
      max-width: 600px;
      margin: 0 auto;
    }

    .controls {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 30px;
      flex-wrap: wrap;
      gap: 15px;
    }
    
    .search-container {
      flex: 1;
      max-width: 500px;
      position: relative;
    }
    
    .search-box {
      width: 100%;
      padding: 12px 20px;
      border: none;
      border-radius: 50px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, .1);
      font-size: 1rem;
      outline: none;
      transition: all .3s ease;
      padding-left: 45px;
    }
    
    .search-box:focus {
      box-shadow: 0 5px 20px rgba(52, 152, 219, .3);
    }
    
    .search-icon {
      position: absolute;
      left: 15px;
      top: 50%;
      transform: translateY(-50%);
      color: #7f8c8d;
    }

    .filter-container {
      display: flex;
      gap: 10px;
      align-items: center;
      flex-wrap: wrap;
    }
    
    .filter-btn {
      padding: 10px 20px;
      background: #fff;
      border: none;
      border-radius: 50px;
      box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
      cursor: pointer;
      transition: all .3s ease;
      font-weight: 500;
    }
    
    .filter-btn.active {
      background: var(--primary);
      color: #fff;
    }
    
    .filter-btn:hover:not(.active) {
      background: #e8f4fc;
    }

    .tabs {
      display: flex;
      background: #fff;
      border-radius: 12px;
      padding: 5px;
      margin-bottom: 20px;
      box-shadow: 0 5px 15px rgba(0, 0, 0, .08);
      overflow-x: auto;
    }
    
    .tab {
      padding: 12px 25px;
      cursor: pointer;
      border-radius: 8px;
      transition: all .3s ease;
      font-weight: 500;
      white-space: nowrap;
    }
    
    .tab.active {
      background: var(--primary);
      color: #fff;
    }

    /* 单一 grid（避免重复） */
    .apps-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
      gap: 25px;
    }

    .app-card {
      background: #fff;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 5px 15px rgba(0, 0, 0, .08);
      transition: all .3s ease;
      position: relative;
    }
    
    .app-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 10px 25px rgba(0, 0, 0, .15);
    }
    
    /* 各应用卡片特殊样式 - 左边框和轻微背景色 */
    .app-card.trilium {
      border-left: 4px solid var(--theme-trilium);
      background: linear-gradient(to right, rgba(26, 188, 156, 0.05) 0%, #fff 30%);
    }
    
    .app-card.odoo {
      border-left: 4px solid var(--theme-odoo);
      background: linear-gradient(to right, rgba(155, 89, 182, 0.05) 0%, #fff 30%);
    }
    
    .app-card.calculator {
      border-left: 4px solid var(--theme-calculator);
      background: linear-gradient(to right, rgba(230, 126, 34, 0.05) 0%, #fff 30%);
    }
    
    .app-card.pdf {
      border-left: 4px solid var(--theme-pdf);
      background: linear-gradient(to right, rgba(231, 76, 60, 0.05) 0%, #fff 30%);
    }
    
    .app-card.cloud {
      border-left: 4px solid var(--theme-cloud);
      background: linear-gradient(to right, rgba(52, 152, 219, 0.05) 0%, #fff 30%);
    }
    
    .app-card.knowledge {
      border-left: 4px solid var(--theme-knowledge);
      background: linear-gradient(to right, rgba(241, 196, 15, 0.05) 0%, #fff 30%);
    }
    
    .app-card.photos {
      border-left: 4px solid var(--theme-photos);
      background: linear-gradient(to right, rgba(26, 188, 156, 0.05) 0%, #fff 30%);
    }
    
    .app-card.blog {
      border-left: 4px solid var(--theme-blog);
      background: linear-gradient(to right, rgba(52, 73, 94, 0.05) 0%, #fff 30%);
    }
    
    .app-card.minecraft {
      border-left: 4px solid var(--theme-minecraft);
      background: linear-gradient(to right, rgba(93, 178, 82, 0.05) 0%, #fff 30%);
    }
    
    .app-card.mods {
      border-left: 4px solid var(--theme-mods);
      background: linear-gradient(to right, rgba(155, 89, 182, 0.05) 0%, #fff 30%);
    }
    
    .app-card.links {
      border-left: 4px solid var(--theme-links);
      background: linear-gradient(to right, rgba(231, 76, 60, 0.05) 0%, #fff 30%);
    }
    
    .app-card.llm {
      border-left: 4px solid var(--theme-llm);
      background: linear-gradient(to right, rgba(52, 152, 219, 0.05) 0%, #fff 30%);
    }
    
    /* 律师办公卡片样式 */
    .app-card.law-pending {
      border-left: 4px solid var(--law-pending);
      background: linear-gradient(to right, rgba(30, 90, 74, 0.05) 0%, #fff 30%);
    }
    .app-card.law-treasure {
      border-left: 4px solid var(--law-treasure);
      background: linear-gradient(to right, rgba(230, 126, 34, 0.05) 0%, #fff 30%);
    }
    .app-card.law-ai {
      border-left: 4px solid var(--law-ai);
      background: linear-gradient(to right, rgba(139, 92, 246, 0.05) 0%, #fff 30%);
    }
    .app-card.law-idcard {
      border-left: 4px solid var(--law-idcard);
      background: linear-gradient(to right, rgba(52, 152, 219, 0.05) 0%, #fff 30%);
    }
    .app-card.law-juanzong {
      border-left: 4px solid var(--law-juanzong);
      background: linear-gradient(to right, rgba(44, 98, 136, 0.05) 0%, #fff 30%);
    }
    .app-card.law-hetong {
      border-left: 4px solid var(--law-hetong);
      background: linear-gradient(to right, rgba(22, 160, 133, 0.05) 0%, #fff 30%);
    }
    .app-card.law-yingxiang {
      border-left: 4px solid var(--law-yingxiang);
      background: linear-gradient(to right, rgba(231, 76, 60, 0.05) 0%, #fff 30%);
    }
    .app-card.law-stats {
      border-left: 4px solid var(--law-stats);
      background: linear-gradient(to right, rgba(11, 95, 164, 0.05) 0%, #fff 30%);
    }
    .app-card.law-gs {
      border-left: 4px solid var(--law-gs);
      background: linear-gradient(to right, rgba(18, 121, 107, 0.05) 0%, #fff 30%);
    }

    .app-badge {
      position: absolute;
      top: 15px;
      right: 15px;
      padding: 5px 10px;
      border-radius: 20px;
      font-size: .75rem;
      font-weight: 600;
      z-index: 10;
      color: #fff;
    }
    
    .badge-official {
      background: var(--success);
    }
    
    .badge-custom {
      background: var(--warning);
    }
    
    /* 各应用专属徽章颜色 */
    .badge-trilium {
      background: var(--theme-trilium);
    }
    
    .badge-odoo {
      background: var(--theme-odoo);
    }
    
    .badge-calculator {
      background: var(--theme-calculator);
    }
    
    .badge-pdf {
      background: var(--theme-pdf);
    }
    
    .badge-cloud {
      background: var(--theme-cloud);
    }
    
    .badge-knowledge {
      background: var(--theme-knowledge);
    }
    
    .badge-photos {
      background: var(--theme-photos);
    }
    
    .badge-blog {
      background: var(--theme-blog);
    }
    
    .badge-minecraft {
      background: var(--theme-minecraft);
    }
    
    .badge-mods {
      background: var(--theme-mods);
    }
    
    .badge-links {
      background: var(--theme-links);
    }
    
    .badge-llm {
      background: var(--theme-llm);
    }
    
    /* 律师徽章 */
    .badge-law-pending { background: var(--law-pending); }
    .badge-law-treasure { background: var(--law-treasure); }
    .badge-law-ai { background: var(--law-ai); }
    .badge-law-idcard { background: var(--law-idcard); }
    .badge-law-juanzong { background: var(--law-juanzong); }
    .badge-law-hetong { background: var(--law-hetong); }
    .badge-law-yingxiang { background: var(--law-yingxiang); }

    .app-icon {
      height: 140px;
      background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      color: #fff;
      font-size: 3rem;
      transition: all 0.3s ease;
    }
    
    /* 各应用图标特殊样式 */
    .app-icon.trilium {
      background: linear-gradient(135deg, var(--theme-trilium) 0%, #16a085 100%);
    }
    
    .app-icon.odoo {
      background: linear-gradient(135deg, var(--theme-odoo) 0%, #8e44ad 100%);
    }
    
    .app-icon.calculator {
      background: linear-gradient(135deg, var(--theme-calculator) 0%, #d35400 100%);
    }
    
    .app-icon.pdf {
      background: linear-gradient(135deg, var(--theme-pdf) 0%, #c0392b 100%);
    }
    
    .app-icon.cloud {
      background: linear-gradient(135deg, var(--theme-cloud) 0%, #2980b9 100%);
    }
    
    .app-icon.knowledge {
      background: linear-gradient(135deg, var(--theme-knowledge) 0%, #f39c12 100%);
    }
    
    .app-icon.photos {
      background: linear-gradient(135deg, var(--theme-photos) 0%, #16a085 100%);
    }
    
    .app-icon.blog {
      background: linear-gradient(135deg, var(--theme-blog) 0%, #2c3e50 100%);
    }
    
    .app-icon.minecraft {
      background: linear-gradient(135deg, var(--theme-minecraft) 0%, #27ae60 100%);
    }
    
    .app-icon.mods {
      background: linear-gradient(135deg, var(--theme-mods) 0%, #8e44ad 100%);
    }
    
    .app-icon.links {
      background: linear-gradient(135deg, var(--theme-links) 0%, #c0392b 100%);
    }
    
    .app-icon.llm {
      background: linear-gradient(135deg, var(--theme-llm) 0%, #2980b9 100%);
    }
    
    /* 律师图标 */
    .app-icon.law-pending { background: linear-gradient(135deg, var(--law-pending) 0%, #0f3b32 100%); }
    .app-icon.law-treasure { background: linear-gradient(135deg, var(--law-treasure) 0%, #b85c0f 100%); }
    .app-icon.law-ai { background: linear-gradient(135deg, var(--law-ai) 0%, #6d28d9 100%); }
    .app-icon.law-idcard { background: linear-gradient(135deg, var(--law-idcard) 0%, #1c6ea9 100%); }
    .app-icon.law-juanzong { background: linear-gradient(135deg, var(--law-juanzong) 0%, #1a4a6e 100%); }
    .app-icon.law-hetong { background: linear-gradient(135deg, var(--law-hetong) 0%, #0e6655 100%); }
    .app-icon.law-yingxiang { background: linear-gradient(135deg, var(--law-yingxiang) 0%, #b03a2e 100%); }
    .app-icon.law-stats { background: linear-gradient(135deg, var(--law-stats) 0%, #073f6e 100%); }
    .app-icon.law-gs { background: linear-gradient(135deg, var(--law-gs) 0%, #0a4f47 100%); }

    .app-content {
      padding: 20px;
    }
    
    .app-title {
      font-size: 1.3rem;
      font-weight: 600;
      margin-bottom: 10px;
      color: var(--secondary);
      display: flex;
      align-items: center;
      gap: 8px;
    }
    
    .app-description {
      font-size: .95rem;
      color: #7f8c8d;
      margin-bottom: 15px;
      line-height: 1.5;
    }
    
    .app-url {
      font-size: .85rem;
      color: #7f8c8d;
      margin-bottom: 15px;
      word-break: break-all;
      display: flex;
      align-items: center;
      gap: 5px;
    }

    /* 端点切换 */
    .endpoints {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 12px;
    }
    
    .endpoint-btn {
      border: 1px solid var(--border);
      background: var(--chip);
      border-radius: 999px;
      padding: 6px 10px;
      font-size: .8rem;
      cursor: pointer;
      color: #1f2937;
      transition: all 0.3s ease;
    }
    
    .endpoint-btn.active {
      color: #fff;
    }
    
    /* 各应用端点特殊样式 */
    .endpoint-btn.trilium.active {
      background: var(--theme-trilium);
      border-color: var(--theme-trilium);
    }
    
    .endpoint-btn.odoo.active {
      background: var(--theme-odoo);
      border-color: var(--theme-odoo);
    }
    
    .endpoint-btn.calculator.active {
      background: var(--theme-calculator);
      border-color: var(--theme-calculator);
    }
    
    .endpoint-btn.pdf.active {
      background: var(--theme-pdf);
      border-color: var(--theme-pdf);
    }
    
    .endpoint-btn.cloud.active {
      background: var(--theme-cloud);
      border-color: var(--theme-cloud);
    }
    
    .endpoint-btn.knowledge.active {
      background: var(--theme-knowledge);
      border-color: var(--theme-knowledge);
    }
    
    .endpoint-btn.photos.active {
      background: var(--theme-photos);
      border-color: var(--theme-photos);
    }
    
    .endpoint-btn.blog.active {
      background: var(--theme-blog);
      border-color: var(--theme-blog);
    }
    
    .endpoint-btn.minecraft.active {
      background: var(--theme-minecraft);
      border-color: var(--theme-minecraft);
    }
    
    .endpoint-btn.mods.active {
      background: var(--theme-mods);
      border-color: var(--theme-mods);
    }
    
    .endpoint-btn.links.active {
      background: var(--theme-links);
      border-color: var(--theme-links);
    }
    
    .endpoint-btn.llm.active {
      background: var(--theme-llm);
      border-color: var(--theme-llm);
    }
    
    .endpoint-badge {
      margin-left: 6px;
      font-size: .7rem;
      opacity: .85;
    }

    .app-actions {
      display: flex;
      gap: 10px;
    }
    
    .app-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: var(--primary);
      color: #fff;
      padding: 8px 15px;
      border-radius: 5px;
      text-decoration: none;
      font-size: .9rem;
      transition: all .3s ease;
      flex: 1;
      justify-content: center;
      border: none;
      cursor: pointer;
    }
    
    .app-btn:hover {
      filter: brightness(90%);
      transform: translateY(-1px);
    }
    
    /* 各应用按钮特殊样式 */
    .app-btn.trilium {
      background: var(--theme-trilium);
    }
    
    .app-btn.odoo {
      background: var(--theme-odoo);
    }
    
    .app-btn.calculator {
      background: var(--theme-calculator);
    }
    
    .app-btn.pdf {
      background: var(--theme-pdf);
    }
    
    .app-btn.cloud {
      background: var(--theme-cloud);
    }
    
    .app-btn.knowledge {
      background: var(--theme-knowledge);
    }
    
    .app-btn.photos {
      background: var(--theme-photos);
    }
    
    .app-btn.blog {
      background: var(--theme-blog);
    }
    
    .app-btn.minecraft {
      background: var(--theme-minecraft);
    }
    
    .app-btn.mods {
      background: var(--theme-mods);
    }
    
    .app-btn.links {
      background: var(--theme-links);
    }
    
    .app-btn.llm {
      background: var(--theme-llm);
    }
    
    .app-btn.secondary {
      background: #ecf0f1;
      color: var(--dark);
    }
    
    .app-btn.secondary:hover {
      background: #d5dbdb;
    }
    
    .fav.on {
      background: #ffe6b3;
      color: #b7791f;
    }
    
    .fav.on:hover {
      background: #ffd98a;
    }

    .no-apps {
      text-align: center;
      padding: 40px;
      color: #7f8c8d;
      font-size: 1.1rem;
      grid-column: 1 / -1;
    }

    footer {
      text-align: center;
      margin-top: 40px;
      padding: 20px;
      color: #7f8c8d;
      font-size: .9rem;
    }
    
    .stats {
      display: flex;
      justify-content: center;
      gap: 30px;
      margin-top: 12px;
    }
    
    .stat-item {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    
    .stat-value {
      font-size: 1.5rem;
      font-weight: 700;
      color: var(--primary);
    }
    
    .stat-label {
      font-size: .85rem;
      color: #7f8c8d;
    }

    @media (max-width: 768px) {
      .apps-grid {
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
      }
      
      h1 {
        font-size: 2rem;
      }
      
      .controls {
        flex-direction: column;
        align-items: stretch;
      }
      
      .search-container {
        max-width: 100%;
      }
      
      .wallpaper-controls {
        bottom: 10px;
        right: 10px;
        flex-wrap: wrap;
        justify-content: center;
      }
    }
    
    @media (max-width: 480px) {
      .apps-grid {
        grid-template-columns: 1fr;
      }
      
      h1 {
        font-size: 1.8rem;
      }
      
      .app-actions {
        flex-direction: column;
      }
    }