feat 加入video

variety/NJTW/NJTW5.html

@@ -100,6 +100,16 @@
             </div>
         </div>
     </div>
+    <!-- 影片區塊：將 iframe 的 src 換成 https://www.youtube.com/embed/你的影片ID -->
+    <div class="video-container">
+        <h2 class="video-title">經典片段回顧</h2>
+        <div class="video-wrapper">
+            <iframe class="video-embed" src="https://www.youtube.com/embed/3zSeN9Ss3BI?si=U_mA4NSbsI_m3ViY"
+                title="新西遊記 5 精華片段" loading="lazy"
+                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
+        </div>
+    </div>
 </body>
 
 </html>

variety/NJTW/njtw5.css

@@ -208,6 +208,54 @@ body.njtw5-page .role {
     box-sizing: border-box;
 }
 
+/* 影片區：與成員卡同語彙（米底、金邊、沈底放映框） */
+body.njtw5-page .video-container {
+    width: 100%;
+    max-width: min(1000px, 100%);
+    box-sizing: border-box;
+    margin-inline: auto;
+    padding: clamp(18px, 3.2vw, 28px);
+    background-color: var(--surface, #fffdf7);
+    border: 1px solid rgba(255, 204, 0, 0.38);
+    border-radius: 18px;
+    box-shadow:
+        0 8px 0 rgba(255, 204, 0, 0.22),
+        0 14px 32px rgba(0, 0, 0, 0.08);
+}
+
+body.njtw5-page .video-container .video-title {
+    margin: 0 0 clamp(14px, 2.5vw, 20px);
+    padding-bottom: clamp(10px, 2vw, 14px);
+    font-size: clamp(1.15rem, 3vw, 1.45rem);
+    font-weight: 800;
+    letter-spacing: 0.06em;
+    text-align: center;
+    color: var(--dark-yellow, #4e492b);
+    border-bottom: 2px solid rgba(255, 204, 0, 0.45);
+    box-shadow: 0 6px 0 -4px rgba(255, 204, 0, 0.18);
+}
+
+body.njtw5-page .video-container .video-wrapper {
+    position: relative;
+    width: 100%;
+    aspect-ratio: 16 / 9;
+    border-radius: 14px;
+    overflow: hidden;
+    background:
+        linear-gradient(145deg, #2a2618 0%, #0f0e0a 50%, #1a1812 100%);
+    box-shadow:
+        inset 0 0 0 1px rgba(255, 204, 0, 0.2),
+        inset 0 12px 40px rgba(0, 0, 0, 0.45);
+}
+
+body.njtw5-page .video-container .video-embed {
+    position: absolute;
+    inset: 0;
+    width: 100%;
+    height: 100%;
+    border: 0;
+    display: block;
+}
 
 @media (max-width: 768px) {
     body.njtw5-page .container {