/* roulang page: index */
:root {
      --primary: #0284c7;
      --primary-dark: #0369a1;
      --primary-light: #e0f2fe;
      --secondary: #0f766e;
      --accent: #f59e0b;
      --neutral-bg: #f8fafc;
      --card-border: #e2e8f0;
    }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background-color: #f8fafc;
      color: #1e293b;
    }
    .hero-gradient {
      background: linear-gradient(135deg, #075985 0%, #0369a1 40%, #0f766e 100%);
    }
    .glass-panel {
      background: rgba(255, 255, 255, 0.12);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid rgba(255, 255, 255, 0.2);
    }
    .custom-shadow {
      box-shadow: 0 10px 30px -5px rgba(2, 132, 199, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.03);
    }
    .custom-shadow-lg {
      box-shadow: 0 20px 35px -10px rgba(15, 118, 110, 0.12), 0 8px 10px -4px rgba(0, 0, 0, 0.04);
    }

/* roulang page: category1 */
:root {
      --primary: #0284c7;
      --primary-dark: #0369a1;
      --primary-light: #e0f2fe;
      --secondary: #0f766e;
      --accent: #f59e0b;
      --neutral-bg: #f8fafc;
      --card-border: #e2e8f0;
    }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background-color: #f8fafc;
      color: #1e293b;
    }
    .hero-gradient {
      background: linear-gradient(135deg, #075985 0%, #0369a1 40%, #0f766e 100%);
    }
    .custom-shadow {
      box-shadow: 0 10px 30px -5px rgba(2, 132, 199, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.03);
    }
    .custom-shadow-lg {
      box-shadow: 0 20px 35px -10px rgba(15, 118, 110, 0.12), 0 8px 10px -4px rgba(0, 0, 0, 0.04);
    }
    .glass-card {
      background: rgba(255, 255, 255, 0.95);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(255, 255, 255, 0.3);
    }