/* roulang page: index */
:root {
      --cinema-gold: #e5a93c;
      --cinema-red: #e50914;
      --cinema-bg: #0b0c10;
      --cinema-panel: #13161c;
      --cinema-card: #181b24;
      --cinema-border: rgba(255, 255, 255, 0.08);
      --cinema-text: #f8fafc;
      --cinema-muted: #94a3b8;
    }
    body {
      background-color: var(--cinema-bg);
      color: var(--cinema-text);
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      overflow-x: hidden;
    }
    .custom-scrollbar::-webkit-scrollbar {
      width: 6px;
      height: 6px;
    }
    .custom-scrollbar::-webkit-scrollbar-track {
      background: #0b0c10;
    }
    .custom-scrollbar::-webkit-scrollbar-thumb {
      background: #272c3a;
      border-radius: 3px;
    }
    .cinema-gradient-overlay {
      background: linear-gradient(180deg, rgba(11, 12, 16, 0.4) 0%, rgba(11, 12, 16, 0.85) 65%, #0b0c10 100%);
    }
    .glow-gold-hover:hover {
      box-shadow: 0 10px 25px -5px rgba(229, 169, 60, 0.25);
    }

/* roulang page: category2 */
:root {
      --cinema-gold: #e5a93c;
      --cinema-red: #e50914;
      --cinema-bg: #0b0c10;
      --cinema-panel: #13161c;
      --cinema-card: #181b24;
      --cinema-border: rgba(255, 255, 255, 0.08);
      --cinema-text: #f8fafc;
      --cinema-muted: #94a3b8;
    }
    body {
      background-color: var(--cinema-bg);
      color: var(--cinema-text);
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      overflow-x: hidden;
    }
    .cinema-gradient-overlay {
      background: linear-gradient(180deg, rgba(11, 12, 16, 0.4) 0%, rgba(11, 12, 16, 0.85) 65%, #0b0c10 100%);
    }
    .cinema-card-shadow {
      box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6);
    }
    .cinema-hover-effect {
      transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease;
    }
    .cinema-hover-effect:hover {
      transform: translateY(-4px);
      box-shadow: 0 16px 30px -8px rgba(229, 169, 60, 0.2);
    }

/* roulang page: category1 */
:root {
      --cinema-gold: #e5a93c;
      --cinema-red: #e50914;
      --cinema-bg: #0b0c10;
      --cinema-panel: #13161c;
      --cinema-card: #181b24;
      --cinema-border: rgba(255, 255, 255, 0.08);
      --cinema-text: #f8fafc;
      --cinema-muted: #94a3b8;
    }
    body {
      background-color: var(--cinema-bg);
      color: var(--cinema-text);
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      overflow-x: hidden;
    }
    .cinema-gradient-overlay {
      background: linear-gradient(180deg, rgba(11, 12, 16, 0.4) 0%, rgba(11, 12, 16, 0.85) 65%, #0b0c10 100%);
    }
    .cinema-card-shadow {
      box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.6), 0 8px 10px -6px rgba(0, 0, 0, 0.5);
    }

/* roulang page: category3 */
:root {
      --cinema-gold: #e5a93c;
      --cinema-red: #e50914;
      --cinema-bg: #0b0c10;
      --cinema-panel: #13161c;
      --cinema-card: #181b24;
      --cinema-border: rgba(255, 255, 255, 0.08);
      --cinema-text: #f8fafc;
      --cinema-muted: #94a3b8;
    }
    body {
      background-color: var(--cinema-bg);
      color: var(--cinema-text);
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      overflow-x: hidden;
    }
    .cinema-gradient-overlay {
      background: linear-gradient(180deg, rgba(11, 12, 16, 0.4) 0%, rgba(11, 12, 16, 0.85) 65%, #0b0c10 100%);
    }
    .cinema-filter-pill {
      transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .cinema-filter-pill:hover, .cinema-filter-pill.active {
      background-color: var(--cinema-gold);
      color: #0b0c10;
      font-weight: 600;
    }
    .anime-card-poster {
      transition: transform 0.35s ease, box-shadow 0.35s ease;
    }
    .anime-card-poster:hover {
      transform: translateY(-4px) scale(1.02);
      box-shadow: 0 16px 32px -8px rgba(0, 0, 0, 0.8), 0 0 16px rgba(229, 169, 60, 0.2);
    }

/* roulang page: category4 */
:root {
      --cinema-gold: #e5a93c;
      --cinema-red: #e50914;
      --cinema-bg: #0b0c10;
      --cinema-panel: #13161c;
      --cinema-card: #181b24;
      --cinema-border: rgba(255, 255, 255, 0.08);
      --cinema-text: #f8fafc;
      --cinema-muted: #94a3b8;
    }
    body {
      background-color: var(--cinema-bg);
      color: var(--cinema-text);
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      overflow-x: hidden;
    }
    .cinema-gradient-overlay {
      background: linear-gradient(180deg, rgba(11, 12, 16, 0.4) 0%, rgba(11, 12, 16, 0.85) 65%, #0b0c10 100%);
    }
    .cinema-banner-overlay {
      background: linear-gradient(90deg, #0b0c10 0%, rgba(11, 12, 16, 0.85) 45%, rgba(11, 12, 16, 0.2) 100%);
    }
    .filter-item-active {
      background-color: rgba(229, 169, 60, 0.15);
      color: var(--cinema-gold);
      border-color: rgba(229, 169, 60, 0.4);
    }
    .spec-badge {
      background: rgba(0, 0, 0, 0.65);
      backdrop-filter: blur(4px);
      border: 1px solid rgba(255, 255, 255, 0.15);
    }

/* roulang page: category5 */
:root {
      --cinema-gold: #e5a93c;
      --cinema-red: #e50914;
      --cinema-bg: #0b0c10;
      --cinema-panel: #13161c;
      --cinema-card: #181b24;
      --cinema-border: rgba(255, 255, 255, 0.08);
      --cinema-text: #f8fafc;
      --cinema-muted: #94a3b8;
    }
    body {
      background-color: var(--cinema-bg);
      color: var(--cinema-text);
      font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      overflow-x: hidden;
    }
    .cinema-gradient-overlay {
      background: linear-gradient(180deg, rgba(11, 12, 16, 0.4) 0%, rgba(11, 12, 16, 0.85) 65%, #0b0c10 100%);
    }
    .text-gold {
      color: var(--cinema-gold);
    }
    .bg-gold {
      background-color: var(--cinema-gold);
    }
    .border-cinema-border {
      border-color: var(--cinema-border);
    }