<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="icon" href="/icon.png"/>
    <title> </title>
    <script src="/static/js/tailwind.js"></script>
    <link rel="stylesheet" href="/static/css/all.min.css">
    <link rel="stylesheet" href="/static/css/style.css">
    <script src="/static/js/webfunc.js"></script>
    <link rel="stylesheet" href="/static/css/plyr.css">
    <script src="/static/js/plyr.polyfilled.js"></script>

    <script>
      tailwind.config = {
        theme: {
          extend: {
            colors: {
              primary: '#165DFF',
            },
          }
        }
      }
    </script>
    <style type="text/tailwindcss">
      @layer utilities {
        .content-auto {
          content-visibility: auto;
        }

        .dropdown-visible {
          visibility: visible;
          opacity: 1;
          transform: translateY(0);
        }

        .dropdown-hidden {
          visibility: hidden;
          opacity: 0;
          transform: translateY(-4px);
        }

        .full-width-dropdown {
          position: fixed;
          left: 0;
          right: 0;
          top: 80px; /* 与拉高后的导航栏高度匹配 */
          width: 100vw;
        }

        /* 白色磨砂遮罩：半透明+模糊效果，hover时显示 */
        .menu-item {
          position: relative;
          z-index: 1;
          padding: 0.75rem 0.75rem; /* 扩大点击区域，与遮罩范围匹配 */
          border-radius: 0.375rem; /* 提前加圆角，避免遮罩与文字错位 */
        }

        .menu-item::after {
          content: '';
          position: absolute;
          left: 0;
          top: 0;
          right: 0;
          bottom: 0;
          background: rgba(255, 255, 255, 0.12); /* 白色半透明 */
          backdrop-filter: blur(4px); /* 磨砂模糊效果 */
          -webkit-backdrop-filter: blur(4px); /* 兼容webkit内核浏览器 */
          border-radius: 0.375rem;
          opacity: 0;
          transition: opacity 0.25s ease;
          z-index: -1;
        }

        .menu-item:hover::after {
          opacity: 1; /* hover时显示磨砂遮罩 */
        }
      }
    </style>
  </head>
  <body class="text-white bg-black">
    <div id="app">

    </div>
  <script type="text/javascript" src="/static/js/chunk-elementUI.js"></script><script type="text/javascript" src="/static/js/chunk-libs.js"></script><script type="text/javascript" src="/static/js/app.js"></script></body>
</html>
