/* roulang page: index */
:root {
      --bg-dark: #0B0E14;
      --bg-card: #121620;
      --primary: #FF5722;
      --accent: #00E5FF;
      --text-main: #FFFFFF;
      --text-muted: #94A3B8;
      --text-dark: #64748B;
    }
    body {
      background-color: var(--bg-dark);
      color: #E2E8F0;
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", Roboto, sans-serif;
      overflow-x: hidden;
    }
    .tactical-border {
      position: relative;
      border: 1px solid var(--brand-border, rgba(255, 255, 255, 0.08));
      transition: all 0.3s ease;
    }
    .tactical-border:hover {
      border-color: rgba(255, 87, 34, 0.5);
      box-shadow: 0 0 20px rgba(255, 87, 34, 0.15);
    }
    .tactical-border-cyan:hover {
      border-color: rgba(0, 229, 255, 0.5);
      box-shadow: 0 0 20px rgba(0, 229, 255, 0.15);
    }
    .hero-mask {
      background: linear-gradient(180deg, rgba(11, 14, 20, 0.75) 0%, #0B0E14 100%);
    }
    .clip-badge {
      clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
    }