/* Styles for individual game pages */
/* ==========================================================================
   Game Page Styles - Unified Dark Theme
   ========================================================================== */

/* 1. Global & Typography
   -------------------------------------------------------------------------- */

/* Set a better box-sizing model on the root element */
*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #121828; /* Main background - dark blue-gray */
    color: #e5e7eb;           /* Main text color - light gray */
    font-family: 'Roboto', sans-serif;
    margin: 0;
}

h1, h2, h3, h4, h5, h6 {
    color: #ffffff; /* White for all headings for emphasis */
}



.back-link {
    color: #9ca3af; /* Mid-gray, less prominent */
    transition: color 0.2s ease-in-out;
    text-decoration: none; /* Ensure no underline from browser defaults */
}

.back-link:hover {
    color: #ffffff; /* White on hover */
}


.game-window {
    width: 70%;
    margin: 0 auto 2rem auto; /* 居中并添加底部外边距 */
    aspect-ratio: 16 / 9;   /* 使用现代CSS属性设置16:9的宽高比 */
    background-color: #000;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    position: relative; /* 为iframe定位提供相对容器 */
}

.game-window iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

.info-box {
    background-color: #1e293b; /* Dark card background */
    border: 1px solid #334155; /* Matching border */
    color: #e5e7eb;
}

.info-box ul {
    list-style-type: none;
    padding-left: 0;
}

.fullscreen-btn {
    background-color: #1e293b; /* Match info box background */
    color: #e5e7eb;
    border: 1px solid #334155;
    transition: background-color 0.2s ease-in-out;
}

.fullscreen-btn:hover {
    background-color: #334155; /* Darker on hover */
}