.tag-filter {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            justify-content: center;
            max-width: 1200px;
            margin: 20px auto 8px;
            padding: 0 20px;
        }
        .tag-btn {
            border: 1px solid #ddd;
            background: #fff;
            border-radius: 20px;
            color: #2f3542;
            padding: 8px 14px;
            font-size: 14px;
        }
        .tag-btn.active,
        .tag-btn:hover {
            border-color: #08794f;
            background: #08794f;
            color: #fff;
        }
        .game-modal {
            display: none;
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.86);
            z-index: 2000;
            padding: 32px 16px;
        }
        .modal-content {
            position: relative;
            max-width: 1080px;
            height: min(78vh, 720px);
            margin: 0 auto;
            background: #111;
            border-radius: 8px;
            overflow: hidden;
        }
        .close-modal {
            position: absolute;
            top: 12px;
            right: 12px;
            z-index: 2;
            width: 34px;
            height: 34px;
            border: 0;
            border-radius: 50%;
            background: rgba(255,255,255,0.9);
            color: #111;
            font-size: 22px;
        }
        .game-iframe {
            width: 100%;
            height: 100%;
            border: 0;
        }

.tag-btn {
    min-height: 44px;
    border-color: var(--border-color);
    background: var(--surface-color);
    color: var(--secondary-color);
}

.tag-btn.active,
.tag-btn:hover {
    border-color: var(--primary-color);
    background: var(--primary-color);
    color: var(--nav-foreground);
}

.modal-content {
    background: var(--nav-background);
    border: 1px solid var(--nav-border);
}

.close-modal {
    width: 44px;
    height: 44px;
    background: var(--surface-color);
    color: var(--secondary-color);
}
