/* roulang page: index */
:root {
      --brand-primary: #133E3B;
      --brand-secondary: #234E4B;
      --brand-accent: #C59B27;
      --brand-dark: #0D2523;
      --brand-canvas: #F7F9F8;
      --brand-text: #1A2423;
      --brand-subtext: #5D6C6A;
      --brand-border: #DDE3E1;
    }
    body {
      background-color: var(--brand-canvas);
      color: var(--brand-text);
      font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
      line-height: 1.7;
      -webkit-font-smoothing: antialiased;
    }
    .num-tabular {
      font-variant-numeric: tabular-nums;
    }
    .custom-shadow {
      box-shadow: 0 10px 30px -4px rgba(19, 62, 59, 0.08), 0 4px 12px -2px rgba(19, 62, 59, 0.04);
    }
    .code-glow {
      box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.5), 0 0 20px rgba(197, 155, 39, 0.15);
    }
    details summary::-webkit-details-marker {
      display: none;
    }
    .hero-mask {
      background: linear-gradient(135deg, rgba(13, 37, 35, 0.94) 0%, rgba(19, 62, 59, 0.88) 100%);
    }
    .grid-lines {
      background-size: 32px 32px;
      background-image: 
        linear-gradient(to right, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
        linear-gradient(to bottomlinear-gradient(to bottom, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
            }
        

Completed the CSS rule and closed the `<style>` tag, preparing for the `<head>` closure and the start of the `<body>`. The project blueprint needs a check to make sure the core requirements, including the key phrase "智能房产推荐系统", and SEO rules are respected throughout the content. Also, the `