/* roulang page: index */
:root {
      --brand-gradient: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #4338ca 100%);
      --accent-gradient: linear-gradient(135deg, #ea580c 0%, #f59e0b 100%);
      --card-shadow: 0 10px 30px -5px rgba(15, 23, 42, 0.05), 0 4px 12px -2px rgba(15, 23, 42, 0.03);
      --card-hover-shadow: 0 20px 40px -8px rgba(30, 27, 75, 0.12);
    }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background-color: #f8f9fa;
      color: #1e293b;
    }
    .cinema-card {
      box-shadow: var(--card-shadow);
      transition: all 0.25s ease-in-out;
    }
    .cinema-card:hover {
      box-shadow: var(--card-hover-shadow);
      transform: translateY(-4px);
    }
    .code-console {
      background: #0b0f19;
      border: 1px solid #1e293b;
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    }

/* roulang page: article */
:root {
      --brand-gradient: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #4338ca 100%);
      --accent-gradient: linear-gradient(135deg, #ea580c 0%, #f59e0b 100%);
      --card-shadow: 0 10px 30px -5px rgba(15, 23, 42, 0.05), 0 4px 12px -2px rgba(15, 23, 42, 0.03);
      --card-hover-shadow: 0 20px 40px -8px rgba(30, 27, 75, 0.12);
    }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background-color: #f8f9fa;
      color: #1e293b;
    }
    .cinema-card {
      box-shadow: var(--card-shadow);
      transition: all 0.25s ease-in-out;
    }
    .cinema-card:hover {
      box-shadow: var(--card-hover-shadow);
      transform: translateY(-4px);
    }
    .article-body h2 {
      font-size: 1.5rem;
      font-weight: 700;
      color: #0f172a;
      margin-top: 2.25rem;
      margin-bottom: 1rem;
      padding-bottom: 0.5rem;
      border-bottom: 1px solid #e2e8f0;
    }
    .article-body h3 {
      font-size: 1.25rem;
      font-weight: 600;
      color: #1e293b;
      margin-top: 1.75rem;
      margin-bottom: 0.75rem;
    }
    .article-body p {
      margin-bottom: 1.25rem;
      line-height: 1.85;
      color: #334155;
    }
    .article-body img {
      border-radius: 1rem;
      margin: 1.5rem auto;
      max-width: 100%;
      height: auto;
    }
    .article-body blockquote {
      border-left: 4px solid #f59e0b;
      background-color: #fffbeb;
      padding: 1rem 1.25rem;
      border-radius: 0 0.75rem 0.75rem 0;
      margin: 1.5rem 0;
      color: #92400e;
      font-style: italic;
    }
    .article-body ul, .article-body ol {
      margin: 1rem 0 1.25rem 1.5rem;
      color: #334155;
    }
    .article-body li {
      margin-bottom: 0.5rem;
      line-height: 1.7;
    }

/* roulang page: category1 */
:root {
      --brand-gradient: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #4338ca 100%);
      --accent-gradient: linear-gradient(135deg, #ea580c 0%, #f59e0b 100%);
      --card-shadow: 0 10px 30px -5px rgba(15, 23, 42, 0.05), 0 4px 12px -2px rgba(15, 23, 42, 0.03);
      --card-hover-shadow: 0 20px 40px -8px rgba(30, 27, 75, 0.12);
    }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background-color: #f8f9fa;
      color: #1e293b;
    }
    .cinema-card {
      box-shadow: var(--card-shadow);
      transition: all 0.25s ease-in-out;
    }
    .cinema-card:hover {
      box-shadow: var(--card-hover-shadow);
      transform: translateY(-4px);
    }
